/* Valentim Plumbing cleaner visual theme */
/* Uses fewer colors: navy/teal + warm orange CTA */

:root {
  --navy: #0b2533;
  --navy-2: #123846;
  --blue: #176b7a;
  --blue-2: #1f8292;
  --orange: #d9781f;
  --orange-2: #e89033;
  --green: #176b7a;
  --bg: #f6f8f7;
  --card: #ffffff;
  --ink: #0b2533;
  --muted: #607179;
  --line: rgba(11, 37, 51, .12);
  --shadow: 0 22px 60px rgba(11, 37, 51, .13);
}

body {
  background: var(--bg) !important;
  color: var(--ink) !important;
}

/* Top strip: cleaner, less loud */
.top-strip {
  background: var(--navy) !important;
  color: #f5fbfc !important;
}

.top-strip .container {
  font-size: 14px !important;
}

/* Logo/header cleanup */
.logo-row {
  background: rgba(255,255,255,.98) !important;
}

.logo-text strong,
.logo-text span,
.logo-mark {
  color: var(--blue) !important;
}

.logo-mark {
  font-size: 38px !important;
}

.contact-mini i {
  background: #e9f3f5 !important;
  color: var(--blue) !important;
}

.contact-mini strong {
  color: var(--navy) !important;
}

.contact-mini span {
  color: var(--muted) !important;
}

/* Buttons */
.btn {
  background: var(--orange) !important;
  color: #fff !important;
  border-radius: 10px !important;
  box-shadow: 0 14px 30px rgba(217, 120, 31, .22) !important;
}

.btn:hover {
  background: var(--orange-2) !important;
}

.btn-blue {
  background: var(--blue) !important;
  box-shadow: 0 14px 30px rgba(23, 107, 122, .22) !important;
}

.btn-white {
  background: #fff !important;
  color: var(--blue) !important;
  border: 1px solid rgba(255,255,255,.55) !important;
}

/* Navigation */
.main-nav {
  background: var(--blue) !important;
}

.nav-links a {
  border-left: 1px solid rgba(255,255,255,.10) !important;
}

.nav-links a:hover,
.nav-links a.active {
  background: rgba(11, 37, 51, .18) !important;
}

/* Language buttons */
.langs span {
  cursor: pointer !important;
  background: rgba(255,255,255,.16) !important;
  color: #fff !important;
  transition: .18s ease !important;
}

.langs span.active {
  background: #fff !important;
  color: var(--blue) !important;
}

/* Hero: more premium, less harsh */
.hero {
  background:
    linear-gradient(90deg, rgba(11,37,51,.88) 0%, rgba(11,37,51,.68) 45%, rgba(11,37,51,.35) 100%),
    url("../img/hero.jpg") center center / cover no-repeat,
    url("../img/hero-real-plumbing-v817.jpg") center center / cover no-repeat !important;
}

.hero::after {
  background:
    radial-gradient(circle at 72% 18%, rgba(217,120,31,.14), transparent 28%),
    linear-gradient(180deg, rgba(11,37,51,0) 55%, rgba(11,37,51,.68) 100%) !important;
}

.hero-kicker {
  border-color: rgba(217,120,31,.85) !important;
  background: rgba(217,120,31,.12) !important;
}

.hero h1 {
  letter-spacing: -.06em !important;
}

.emergency-card {
  border-radius: 14px !important;
  overflow: hidden !important;
}

.emergency-card .card-head {
  background: var(--orange) !important;
}

.emergency-card h2 {
  color: var(--navy) !important;
}

.call-box {
  background: #eef5f6 !important;
}

.call-box i {
  background: var(--blue) !important;
}

/* Sections */
.section {
  background: var(--bg);
}

.services,
.area {
  background: #fff !important;
}

.section h2,
.service-card h3,
.contact-card strong,
.emergency-card h2 {
  color: var(--navy) !important;
}

.eyebrow {
  color: var(--orange) !important;
}

.service-card,
.contact-card,
.emergency-card {
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
}

.service-card {
  border-radius: 14px !important;
}

.service-card img {
  filter: saturate(.92) contrast(1.02) !important;
}

/* Proof strip */
.proof {
  background: var(--navy) !important;
}

.proof-item strong {
  color: var(--orange) !important;
}

/* Gallery */
.gallery {
  background: #eef5f6 !important;
}

.gallery-card {
  border-radius: 14px !important;
}

.gallery-card b {
  background: var(--orange) !important;
}

/* Service area */
.area-list span {
  background: #eef5f6 !important;
  color: var(--navy) !important;
  border-color: var(--line) !important;
  border-radius: 10px !important;
}

/* CTA */
.cta {
  background:
    linear-gradient(90deg, rgba(11,37,51,.94), rgba(23,107,122,.80)),
    url("../img/water-heater.jpg") center/cover no-repeat !important;
}

/* Footer */
.footer {
  background: var(--navy) !important;
}

/* Preview note less intrusive */
.preview-note {
  background: rgba(11,37,51,.88) !important;
  border-radius: 12px !important;
}

/* Forms */
.form input,
.form textarea {
  border-radius: 10px !important;
}

.form input:focus,
.form textarea:focus {
  outline: 2px solid rgba(23,107,122,.28) !important;
  border-color: var(--blue) !important;
}

/* Mobile header spacing */
@media (max-width: 720px) {
  .logo-text strong {
    font-size: 26px !important;
  }

  .top-strip .container {
    font-size: 13px !important;
  }
}