/* ===========================
   MT Vamos — Theme Styles
   Colors: teal_blue #006fa7, light_gold #d6c58a
   =========================== */

   :root {
    --teal: #006fa7;
    --gold: #d6c58a;
    --white: #ffffff;
    --black: #000000;
    --dark-gray: #9e9b9b;
    --light-gray: #f1f1f1;
    --green: #199675;
    --label: #333333;
    --danger: #ff0000;
  }
  
  * { box-sizing: border-box; }
  
  html, body {
    font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif;
    color: var(--label);
  }
  
  h1,h2,h3,h4,h5,h6 { color: #1d2939; }
  
  .text-teal { color: var(--teal) !important; }
  .text-gold { color: var(--gold) !important; }
  
  .bg-teal { background-color: var(--teal) !important; }
  .bg-gold { background-color: var(--gold) !important; }
  .bg-light-gray { background-color: var(--light-gray) !important; }
  
  .bg-gold-subtle {
    background-color: color-mix(in srgb, var(--gold) 22%, white);
  }
  .bg-teal-soft {
    background-color: color-mix(in srgb, var(--teal) 12%, white);
  }
  
  .border-gold { border-color: var(--gold) !important; }
  
  /* Buttons */
  .btn-teal {
    background: var(--teal);
    color: #fff;
    border-color: var(--teal);
  }
  .btn-teal:hover,
  .btn-teal:focus { background: #005a86; border-color: #005a86; color: #fff; }
  
  .btn-outline-teal {
    color: var(--teal);
    border: 1px solid var(--teal);
    background: transparent;
  }
  .btn-outline-teal:hover,
  .btn-outline-teal:focus { background: var(--teal); color: #fff; }
  
  .link-teal { color: var(--teal); text-decoration: none; }
  .link-teal:hover { text-decoration: underline; }
  
  /* Header */
  .header .nav-link,
  .header .nav-link.active { color: var(--white); }
  .header .border-top {
    background-color: var(--teal);;
  }
  
  .hero-section img.img-fluid{
    max-height: 420px;
  }

  /* Hero */
  .hero-section { padding: 32px 0 16px; }
  @media (min-width: 992px) { .hero-section { padding: 56px 0; } }
  
  .hero-bg-shape {
    position: absolute;
    inset: auto -10% -20% -10%;
    height: 40%;
    background: radial-gradient(80% 60% at 50% 0%, color-mix(in srgb, var(--teal) 12%, white) 0%, transparent 70%);
    z-index: -1;
  }
  
  /* Cards / steps */
  .step-icon {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 28px;
    margin: 0 auto;
  }
  
  /* App download blob */
  .phone-qr .blob {
    position: absolute;
    width: 220px;
    height: 220px;
    right: -22px;
    bottom: -22px;
    border-radius: 50%;
    filter: blur(40px);
    opacity: 0.25;
  }
  
  .store-btn small { opacity: .7; display: block; line-height: 1; }
  
  /* Sections */
  .py-6 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
  @media (min-width: 992px) { .py-6 { padding-top: 5rem; padding-bottom: 5rem; } }
  
  /* Footer */
  .footer { background: #0a2533; }
  .footer .footer-link { color: #c9d6df; text-decoration: none; }
  .footer .footer-link:hover { color: var(--white); }
  .footer .text-white-75 { color: rgba(255,255,255,.75); }
  .footer .text-white-50 { color: rgba(255,255,255,.5); }
  .footer .btn-light { background: #fff; border: none; }
  
  /* Swiper controls colored */
  .hero-swiper .swiper-button-next,
  .hero-swiper .swiper-button-prev {
    color: var(--teal);
    display: none !important;
  }
  .hero-swiper .swiper-pagination-bullet-active,
  .testimonial-swiper .swiper-pagination-bullet-active {
    background: var(--teal);
  }
  
  /* Utilities */
  .rounded-pill { border-radius: 999px !important; }
  .fw-extrabold { font-weight: 800 !important; }
  
  /* Accessibility focus ring */
  :focus-visible {
    outline: 3px solid color-mix(in srgb, var(--teal) 45%, white);
    outline-offset: 2px;
  }  


  /* ===== About / Sobre Nós ===== */
.about-hero {
    background: radial-gradient(1200px 280px at 50% 0%, color-mix(in srgb, var(--teal) 10%, white) 0%, transparent 70%);
  }
  .about-hero-bg { position: absolute; inset: 0; pointer-events: none; }
  
  .feature-chip {
    display:flex; gap:.75rem; align-items:flex-start; padding:.75rem 1rem;
    background: #fff; border:1px solid #eef1f4; border-radius: .75rem;
  }
  .feature-chip i { font-size: 1.1rem; margin-top: .15rem; }
  
  .about-photo .about-badge {
    position:absolute; right: 12px; bottom: 12px; border-radius: 1rem;
  }
  
  .metric-card {
    background:#fff; border:1px solid #eef1f4; border-radius:1rem; padding:1.25rem; text-align:center;
    box-shadow: 0 1px 0 rgba(16,24,40,.04);
  }
  .metric-card .icon { font-size:1.25rem; color: var(--teal); margin-bottom:.25rem; }
  .metric-card .value { font-weight:800; font-size:1.75rem; line-height:1; }
  .metric-card .label { color:#65758b; font-size:.9rem; margin-top:.25rem; }
  
  .team-card img { aspect-ratio: 3 / 3.5; object-fit: cover; }
  .team-card .card-body { padding: .9rem 1rem; }
  
  .award-card {
    background:#fff; border:1px dashed #e6e8ec; border-radius:1rem; padding:1rem 1.25rem; text-align:center;
  }
  .award-card .year { font-weight:700; color:var(--teal); }
  .award-card .title { font-weight:600; }
  .award-card .desc { color:#6b7280; font-size:.9rem; }
  
  .partner-card {
    background:#fff; border:1px solid #eef1f4; border-radius:.75rem; padding: 18px; text-align:center;
  }
  .partner-card img { max-height:42px; width:auto; filter: grayscale(30%); }
  .partner-card:hover img { filter:none; }
  
  /* breadcrumb look */
  .breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: #98a2b3; }

  /* ===== Contact page ===== */
.contact-hero {
    background: radial-gradient(1200px 280px at 50% 0%, color-mix(in srgb, var(--gold) 14%, white) 0%, transparent 70%);
  }
  .contact-tile {
    display:flex; gap:.75rem; align-items:center;
    background:#fff; border:1px solid #eef1f4; border-radius:.75rem; padding:.75rem 1rem; margin-bottom:.75rem;
  }
  .contact-tile .icon {
    width:36px; height:36px; display:grid; place-items:center;
    border-radius:50%; background: color-mix(in srgb, var(--teal) 12%, white); color: var(--teal);
  }
  
  .map-wrap iframe { display:block; width:100%; height:420px; }
  @media (max-width: 575.98px) { .map-wrap iframe { height: 320px; } }