.root{ }
:root{
  --primary:#e60012;
  --accent:#111827;
  --bs-primary:#e60012;
  --bs-primary-rgb:230,0,18;
}
html,body{height:100%}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial}

/* small utility tweaks */
#year{font-weight:600}

/* Bootstrap overrides */
.btn-primary{background-color:var(--primary);border-color:var(--primary)}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary.dropdown-toggle.show,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled):hover,
.btn-primary:not(:disabled):not(.disabled):focus{
  background-color:#c50010!important;
  border-color:#c50010!important;
  color:#fff!important;
}
.btn-outline-primary{color:var(--primary);border-color:var(--primary)}
.btn-outline-primary:hover,
.btn-outline-primary:focus{
  color:#fff!important;
  background-color:var(--primary)!important;
  border-color:var(--primary)!important;
}
.bg-primary, .badge.bg-primary {background-color:var(--primary)!important; border-color:var(--primary)!important}
.bg-primary:hover, .badge.bg-primary:hover{background-color:#c50010!important; border-color:#c50010!important}
.text-primary {color:var(--primary)!important}
.text-primary:hover {color:var(--primary)!important}
.border-primary {border-color:var(--primary)!important}
.border-primary:hover {border-color:var(--primary)!important}
.nav-link{color:#333}
.nav-link:hover{color:var(--primary)}

/* Navbar logo sizing - responsive and preserves aspect ratio */
.navbar-brand img,
.navbar-logo img {
  height:48px;    /* desired display height */
  width:auto;     /* keep aspect ratio */
  max-width:160px;/* avoid overly large logos */
  display:block;
}

/* Optional container styling when using .navbar-logo wrapper */
.navbar-logo{
  display:inline-block;
  padding:6px;
  border-radius:4px;
  transition:transform .18s ease, box-shadow .18s ease;
}
.navbar-logo:hover{transform:translateY(-2px);}

/* Hero styles */
.hero {
  background-image: linear-gradient(180deg, rgba(0,0,0,0.35), rgba(0,0,0,0.35)), url('../assets/hero.jpg');
  background-size: cover;
  background-position: center;
  color: #fff;
  padding: 4rem 0;
  position: relative;
  overflow: hidden;
}
.hero .lead{color:rgba(255,255,255,0.95)}
.hero .hero-card{background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.08);}
.hero .stat {color: #fff;}

/* About section */
.about-card{background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(255,255,255,0.95));}
.about-icon{width:54px;height:54px;flex:0 0 54px}
.about-card h6{color:var(--accent)}
.about-card p{color:#6b7280}

/* Contact card */
.contact-card{
  background:#fff;
  border:1px solid rgba(17,24,39,0.08);
  box-shadow:0 28px 70px rgba(17,24,39,0.08);
}
.contact-card h5{
  letter-spacing:0.04em;
  color:var(--accent);
}
.contact-card p{color:#4b5563;}
.contact-card .badge{font-weight:600;letter-spacing:0.03em;}
.contact-card .bg-primary-subtle{
  background-color:rgba(230,0,18,0.1)!important;
  color:var(--primary)!important;
  border:1px solid rgba(230,0,18,0.18);
}
.contact-info{
  border:1px solid rgba(17,24,39,0.08);
  box-shadow:0 16px 40px rgba(17,24,39,0.06);
  transition:transform .2s ease,box-shadow .2s ease;
}
.contact-info:hover{transform:translateY(-3px);box-shadow:0 20px 48px rgba(17,24,39,0.1);}
.contact-info .contact-icon{
  width:44px;
  height:44px;
  min-width:44px;
}
.contact-card iframe{filter:grayscale(20%) contrast(90%);}
.contact-card .small{text-transform:none}
.bg-light .form-control{border-radius:8px}

/* Social icons in navbar */
.social-link{color:#333;display:inline-flex;align-items:center;justify-content:center}
.social-link svg{width:20px;height:20px}
.social-link:hover{color:var(--primary);text-decoration:none}

/* Navbar appearance and transitions */
.navbar-transparent{background:transparent;transition:background-color .25s ease,box-shadow .25s ease}
.navbar-solid{background:#fff;box-shadow:0 6px 18px rgba(17,24,39,0.06)}
.brand-text{color:var(--accent);font-size:1rem}
.nav-link.active{color:var(--primary)!important;font-weight:600}
.navbar-logo{height:48px;width:auto}

/* Responsive tweaks */
@media (max-width: 991.98px){
  .nav-item.d-none.d-md-flex{display:none!important}
}

@media (max-width: 767.98px){
  .hero{padding:2rem 0}
  .hero h1{font-size:1.75rem}
  .hero .lead{font-size:0.95rem}
  .navbar-logo{height:38px}
  .brand-text{font-size:0.88rem}
  .about-card{padding:0.75rem}
  .about-icon{width:40px;height:40px}
  .about-card h6{font-size:0.95rem}
  .social-link{margin-right:.4rem}
  .contact-card{padding:1.25rem}
  .contact-card .contact-icon{width:38px;height:38px}
  .contact-card iframe{height:180px}
  .shadow-sm.rounded.p-4.bg-light .btn, .shadow-sm.rounded.p-4.bg-light .btn-outline-secondary{width:100%}
  .hero .stat{font-size:1rem}
  .navbar-nav .nav-link{padding-left:0;padding-right:0}
  .d-flex.flex-column.flex-sm-row{flex-direction:column!important}
  .d-flex.flex-column.flex-sm-row .btn{width:100%}
  .stats-row{gap:0.75rem}
  .stats-row .text-center{background:rgba(255,255,255,0.08);padding:1rem 0;border-radius:0.85rem}
  .contact-card{padding:1.5rem}
  .contact-info{padding:1rem}
}

@media (max-width: 479.98px){
  .hero{padding:1.8rem 0}
  .hero h1{font-size:1.55rem}
  .hero .lead{font-size:0.9rem}
  .about-card{padding:.6rem}
  .hero .stat{font-size:0.95rem}
  .contact-card iframe{height:160px}
  .contact-card .contact-icon{width:34px;height:34px}
  .contact-card{padding:1rem}
  .navbar-nav .nav-link{padding-left:0;padding-right:0}
}

.whatsapp-float {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #25d366;
  color: #fff;
  border-radius: 50%;
  box-shadow: 0 12px 24px rgba(0,0,0,0.18);
  transition: transform .2s ease, box-shadow .2s ease;
  z-index: 999;
}
.whatsapp-float:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 26px rgba(0,0,0,0.22);
}
.whatsapp-float svg {width:24px; height:24px;}