
/* =========================================================
   Turtlemint‑inspired Theme Override (drop in after styles.css)
   Primary: #009F69  |  Accent: #FB6962
   This file only overrides styles—no HTML changes needed.
   ========================================================= */
:root{
  --tm-green: #009F69;
  --tm-green-600: #00885A;
  --tm-green-50: #F0FAF6;
  --tm-green-100:#E6F4EF;
  --tm-green-200:#D5EFE5;
  --tm-coral: #FB6962;
  --tm-black: #0F172A;    /* slate-900 */
  --tm-gray-700:#334155;  /* slate-700 */
  --tm-gray-500:#64748B;  /* slate-500 */
  --radius-xl: 1.25rem;
  --shadow-soft: 0 10px 24px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.06);
  --shadow-card: 0 10px 30px rgba(0,159,105,.12), 0 2px 10px rgba(0,0,0,.04);
}

html, body{ color:var(--tm-black); }

/* ---------------------------------
   Header
----------------------------------*/
.header{ background:#fff; border-bottom:1px solid var(--tm-green-100); position:sticky; top:0; z-index:50; }
.logo-icon{ background:var(--tm-green); color:#fff !important; border-radius:10px; }
.logo-text{ color:var(--tm-black); font-weight:800; letter-spacing:.2px; }

.nav .nav-link{ color:var(--tm-gray-700); transition:color .2s, box-shadow .2s; font-weight:600; }
.nav .nav-link:hover{ color:var(--tm-green); }
.nav .nav-link.active{ color:var(--tm-green); box-shadow: inset 0 -3px 0 var(--tm-green); }

.mobile-menu{ background:#fff; border-top:1px solid var(--tm-green-100); }
.mobile-nav .nav-link.active{ color:var(--tm-green); }

/* ---------------------------------
   Buttons
----------------------------------*/
.btn-primary,
.btn-secondary{
  background:var(--tm-green);
  color:#fff; border:none;
  border-radius:999px; padding:.9rem 1.25rem;
  box-shadow:var(--shadow-soft);
}
.btn-primary:hover,
.btn-secondary:hover{ background:var(--tm-green-600); }

.btn-outline,
.btn-outline-green{
  background:#fff;
  border:2px solid var(--tm-green);
  color:var(--tm-green);
  border-radius:999px;
}
.btn-outline:hover,
.btn-outline-green:hover{
  background:var(--tm-green);
  color:#fff;
}

.btn-outline-white{ border:2px solid #fff; color:#fff; background:transparent; }
.btn-outline-white:hover{ background:#fff; color:var(--tm-green); }

.btn-whatsapp{ background:var(--tm-green); border:none; color:#fff; }
.btn-whatsapp:hover{ background:var(--tm-green-600); }

/* ---------------------------------
   Badges, pills
----------------------------------*/
.badge{
  background:var(--tm-green-50);
  color:var(--tm-green);
  border:1px solid var(--tm-green-100);
  font-weight:700;
}

/* ---------------------------------
   Hero
----------------------------------*/
.hero{
  background:linear-gradient(180deg, var(--tm-green-50) 0%, #fff 65%);
}
.hero-title{ line-height:1.15; }
.hero-title .text-blue{ color:var(--tm-green) !important; } /* reuse existing class */
.hero-subtitle{ color:var(--tm-gray-500); }
.hero-image .hero-img{ border-radius: var(--radius-xl); box-shadow: var(--shadow-card); }
.hero-bg-circle-1{ background:radial-gradient(60% 60% at 30% 30%, rgba(0,159,105,.18), transparent 60%); }
.hero-bg-circle-2{ background:radial-gradient(60% 60% at 60% 60%, rgba(0,159,105,.10), transparent 65%); }

/* ---------------------------------
   Cards (services, features, testimonials)
----------------------------------*/
.service-card,
.feature-card,
.testimonial-card{
  background:#fff; border:1px solid var(--tm-green-100);
  border-radius:var(--radius-xl);
  box-shadow:var(--shadow-soft);
}
.service-card{ position:relative; overflow:hidden; }
.service-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:4px; background:var(--tm-green);
}
.service-icon{ background:var(--tm-green-50); color:var(--tm-green); border-radius:14px; }
.feature-icon{ background:var(--tm-green-50); color:var(--tm-green); border-radius:12px; }
.stars{ color:var(--tm-coral); }

/* ---------------------------------
   CTA section
----------------------------------*/
.cta-section{ background:var(--tm-green); color:#fff; }
.cta-section .cta-title{ color:#fff; }
.cta-section .cta-subtitle{ color:#ECFDF5; }

/* ---------------------------------
   Footer
----------------------------------*/
.footer{ background:#0B1C16; color:#DDF3EA; }
.footer a{ color:#DDF3EA; }
.footer a:hover{ color:#fff; text-decoration:underline; }
.footer .logo-icon{ background:#fff; color:var(--tm-green) !important; }
.footer .footer-bottom{ border-top:1px solid rgba(255,255,255,.12); }

/* ---------------------------------
   Form / Modal
----------------------------------*/
.modal .modal-content{ border-radius:var(--radius-xl); }
input[type="text"], input[type="tel"], input[type="email"], select, textarea{
  border:1.5px solid var(--tm-green-100); border-radius:12px; outline:none;
}
input:focus, select:focus, textarea:focus{
  border-color:var(--tm-green);
  box-shadow:0 0 0 4px rgba(0,159,105,.12);
}

/* ---------------------------------
   WhatsApp Float
----------------------------------*/
.whatsapp-float .whatsapp-btn{
  background:var(--tm-green); color:#fff; border:none; box-shadow:var(--shadow-card);
}
.whatsapp-float .whatsapp-btn:hover{ background:var(--tm-green-600); }
.whatsapp-menu{ border:1px solid var(--tm-green-100); border-radius:16px; box-shadow:var(--shadow-soft); }

/* ---------------------------------
   Utilities
----------------------------------*/
.text-blue{ color:var(--tm-green) !important; } /* back-compat */
.text-green{ color:var(--tm-green) !important; }
.bg-mint{ background:var(--tm-green-50) !important; }
.border-mint{ border-color:var(--tm-green) !important; }
.shadow-card{ box-shadow:var(--shadow-card) !important; }
.round-xl{ border-radius:var(--radius-xl) !important; }

/* ---------------------------------
   Small tweaks for spacing & containers
----------------------------------*/
.section-header .section-title{ letter-spacing:.2px; }
.container{ max-width:1200px; }
