/* Trago — Design tokens */
:root {
  --navy-900: #0E2A47;
  --navy-700: #16477B;
  --navy-600: #184878;
  --navy-500: #1A4B99;
  --blue-300: #7EABD5;
  --blue-600: #004898;
  --orange-500: #FF7820;
  --orange-600: #E86A12;
  --gray-050: #F8F8F8;
  --gray-200: #DCE2EA;
  --gray-500: #7C8B9B;
  --ink: #142A40;
  --ink-muted: #5A6B7B;
  --font-display: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body: 'Montserrat', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-md: 16px;
  --radius-pill: 999px;
  --shadow-card: 0 12px 30px rgba(20,42,64,0.14);
  --shadow-lg: 0 22px 50px rgba(20,42,64,0.18);
  --shadow-cta: 0 10px 22px rgba(255,120,32,0.30);
  --container: 1200px;
  --container-wide: 1320px;
  --gutter: clamp(1.25rem, 4vw, 4rem);
  --section-y: 96px;
  --section-y-sm: 64px;
  --text-h2: 2rem;
  --text-h3: 1.5rem;
  --text-body-lg: 1.1875rem;
  --text-body: 1.0625rem;
  --text-sm: 0.9375rem;
  --text-xs: 0.8125rem;
  --text-label: 0.8125rem;
  --text-stat: 3rem;
  --tracking-tight: -0.01em;
  --tracking-label: 0.12em;
}

/* Reset */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: 1.6;
  color: var(--ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
p { margin: 0 0 1em; }
a { color: var(--navy-600); text-decoration: none; }
a:hover { color: var(--orange-500); }

/* Layout */
.container      { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.container-wide { max-width: var(--container-wide); margin: 0 auto; padding: 0 var(--gutter); }

/* ── Header ── */
.site-hdr {
  position: absolute; top: 0; left: 0; right: 0; z-index: 10;
  transition: background 220ms;
}
.site-hdr.menu-open { background: var(--navy-600); }
.hdr-wrap {
  max-width: var(--container); margin: 0 auto;
  padding: 18px var(--gutter);
  display: flex; align-items: center; justify-content: space-between;
  position: relative;
}
.hdr-logo { height: 38px; width: auto; }
.hdr-logo-link { display: flex; align-items: center; }
.hdr-nav { display: flex; align-items: center; gap: var(--space-10); }
.hdr-nav a {
  color: #fff; text-decoration: none;
  font-family: var(--font-display); font-weight: 700;
  font-size: 15px; letter-spacing: var(--tracking-label); text-transform: uppercase;
}
.hdr-nav a:hover { color: var(--orange-500); }
.hdr-nav a.nav-active { position: relative; padding-bottom: 6px; }
.hdr-nav a.nav-active::after {
  content: ''; position: absolute; left: 0; bottom: 0;
  width: 50%; height: 2px; background: #fff;
}

/* Burger — hidden on desktop */
.hdr-burger {
  display: none; align-items: center; justify-content: center;
  width: 44px; height: 44px;
  background: none; border: none; cursor: pointer; padding: 0;
}
.ico-close { display: none; }

/* ── Hero (shared) ── */
.hero {
  position: relative; min-height: 640px;
  display: flex; align-items: center; overflow: hidden;
  background: var(--navy-700);
}
.hero-sm { min-height: 560px; }
.hero-bg-full {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  pointer-events: none;
}
/* Poster shown behind the hero video; visible only if the video is hidden
   because autoplay was blocked (so no browser play button is left on screen). */
.hero-bg-fallback { background: url('assets/hero-poster.webp') center / cover no-repeat; }
.hero-bg-right {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover; object-position: center;
}
.hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(115deg, rgba(14,42,71,0.86) 0%, rgba(20,58,99,0.66) 42%, rgba(20,58,99,0.18) 100%);
}
.hero-overlay-left {
  position: absolute; inset: 0;
  background: linear-gradient(100deg, rgba(14,42,71,0.96) 0%, rgba(14,42,71,0.88) 26%, rgba(20,58,99,0.45) 58%, rgba(20,58,99,0.08) 100%);
}
.hero-pad {
  position: relative; max-width: var(--container); margin: 0 auto;
  padding: 120px var(--gutter) 64px; width: 100%;
}
.hero-text { max-width: 620px; }
.hero-text-narrow { max-width: 550px; }
.hero-text h1, .hero-text-narrow h1 {
  color: #fff; font-family: var(--font-display); font-size: 40px;
  font-weight: 900; line-height: 1.08; letter-spacing: -0.01em; margin: 0 0 var(--space-5);
}
.hero-text p, .hero-text-narrow p {
  color: rgba(255,255,255,0.9); font-size: calc(var(--text-body-lg) * 1.15); font-weight: 600;
  line-height: 1.4; margin: 0 0 var(--space-8); max-width: 500px;
}
.btn-primary {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 19px 40px;
  font-family: var(--font-display); font-weight: 800;
  font-size: var(--text-body); letter-spacing: var(--tracking-label); text-transform: uppercase;
  color: #fff; background: var(--orange-500);
  border-radius: var(--radius-pill); box-shadow: var(--shadow-cta);
  text-decoration: none; line-height: 1;
  transition: transform 220ms, background 220ms;
}
.btn-primary:hover { background: var(--orange-600); transform: translateY(-2px); color: #fff; }

/* ── Partners ── */
.partners { background: #fff; border-bottom: 1px solid var(--gray-200); }
.partners-row {
  max-width: var(--container); margin: 0 auto;
  padding: 36px var(--gutter);
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-6); flex-wrap: nowrap;
}
.partners-row img {
  height: 66px; width: auto; max-width: 16.2%; object-fit: contain;
  filter: grayscale(1) opacity(0.72);
}

/* ── Homepage services grid ── */
.services { background: var(--gray-050); }
.services .container { padding-top: var(--section-y); padding-bottom: var(--section-y); }
.section-heading-wrap { text-align: center; margin-bottom: var(--space-12); }
.section-heading {
  margin: 0; font-family: var(--font-display); font-weight: 800;
  font-size: var(--text-h2); color: var(--navy-600); letter-spacing: var(--tracking-tight);
  line-height: 1.18;
}
.services-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-5); }
.service-card {
  position: relative; overflow: hidden; border-radius: var(--radius-md);
  aspect-ratio: 1 / 1; box-shadow: var(--shadow-card);
  transition: transform 220ms, box-shadow 220ms; cursor: pointer;
}
.service-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.service-card img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; transition: transform 220ms;
}
.service-card:hover img { transform: scale(1.06); }
.service-card-scrim {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(14,42,71,0.85) 0%, rgba(14,42,71,0.1) 55%);
}
.service-card-title {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: var(--space-5) var(--space-4);
  font-family: var(--font-display); font-weight: 800;
  font-size: var(--text-body-lg); color: #fff; line-height: 1.2;
}

/* ── Why ── */
.why { background: #fff; }
.why-inner {
  max-width: 880px; margin: 0 auto;
  padding: var(--section-y) var(--gutter); text-align: center;
}
.why-inner h2 {
  font-family: var(--font-display); font-weight: 800; font-size: var(--text-h2);
  color: var(--navy-600); letter-spacing: var(--tracking-tight); margin: 0 0 var(--space-10);
}
.why-inner h2 em { font-style: italic; }
.checklist {
  list-style: none; margin: 0 auto; padding: 0; text-align: left;
  display: flex; flex-direction: column; gap: var(--space-2); max-width: 560px;
}
.checklist li {
  display: flex; align-items: flex-start; gap: var(--space-3);
  font-family: var(--font-body); font-weight: 600; font-size: var(--text-body-lg); color: var(--ink);
}
.check {
  flex: none; width: 1.4em; height: 1.4em; color: var(--navy-600);
  font-weight: 900; font-size: 0.85em; line-height: 1.65;
}

/* ── Stats band ── */
.stats { background: var(--navy-500); }
.stats-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  padding-top: var(--space-16); padding-bottom: var(--space-16);
}
.stat {
  text-align: center; display: flex; flex-direction: column;
  gap: var(--space-2); align-items: center; padding: 0 var(--space-4);
}
.stat.stat-left { text-align: left; align-items: flex-start; }
.stat-divider { border-left: 1px solid rgba(255,255,255,0.22); }
.stat-value {
  font-family: var(--font-display); font-weight: 900;
  font-size: var(--text-stat); line-height: 1.08;
  letter-spacing: var(--tracking-tight); color: #fff;
}
.stat-label { font-family: var(--font-body); font-weight: 600; font-size: var(--text-sm); color: rgba(255,255,255,0.78); }

/* ── Coverage ── */
.coverage { background: #8CCDFD; position: relative; overflow: hidden; }
.coverage-map {
  position: absolute; inset: 0;
  background-image: url('uploads/map_02.webp');
  background-repeat: no-repeat; background-position: center; background-size: cover;
}
.coverage-inner {
  position: relative; min-height: 620px;
  padding-top: var(--section-y); padding-bottom: var(--section-y);
}
.coverage-copy { display: flex; flex-direction: column; gap: var(--space-10); max-width: 320px; }
.coverage-copy h2 {
  font-family: var(--font-display); font-weight: 800; font-size: var(--text-h2);
  color: var(--navy-600); letter-spacing: var(--tracking-tight); margin: 0;
}
.coverage-stat-val { color: var(--navy-600); }
.coverage-stat-lbl { color: var(--ink-muted); }

/* ── Contact strip ── */
.contact { background: #fff; }
.contact-grid {
  max-width: 960px; margin: 0 auto;
  padding: var(--section-y-sm) var(--gutter);
  display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-8);
}
.contact-item {
  display: flex; flex-direction: column; align-items: center; gap: var(--space-3);
  text-decoration: none; color: var(--navy-600);
}
.contact-item img { height: 38px; width: auto; }
.contact-item span {
  font-family: var(--font-display); font-weight: 800;
  font-size: calc(var(--text-body-lg) * 1.05);
}
.contact-item:hover { color: var(--orange-500); }
.contact-divider { border-top: 1px solid var(--blue-600); }
.contact-divider-soft { border-top: 2px solid var(--navy-600); opacity: 0.4; }

/* ── Pakalpojumi detail grid ── */
.svc-grid {
  max-width: var(--container); margin: 0 auto;
  padding: var(--section-y) var(--gutter);
  display: grid; grid-template-columns: 1fr 1fr;
  column-gap: var(--space-10); row-gap: var(--space-16);
}
.svc-item-img {
  position: relative; border-radius: var(--radius-md); overflow: hidden; margin-bottom: var(--space-5);
}
.svc-item-img img { width: 100%; height: auto; aspect-ratio: 2/1; object-fit: cover; display: block; }
.svc-item-img-overlay {
  position: absolute; inset: 0; background: rgba(24,72,120,0.35);
}
.svc-item h3 {
  font-family: var(--font-display); font-weight: 800; font-size: var(--text-h3);
  color: var(--blue-600); letter-spacing: var(--tracking-tight); margin: 0 0 var(--space-3);
}
.svc-item p {
  color: var(--navy-600); font-weight: 500; line-height: 1.55;
  font-size: var(--text-body); margin: 0; max-width: 440px;
}

/* ── Par mums story ── */
.story-grid {
  max-width: var(--container); margin: 0 auto;
  padding: var(--section-y) var(--gutter);
  display: grid; grid-template-columns: 1fr 1.05fr;
  gap: var(--space-12); align-items: start;
}
.story-grid h2 {
  font-family: var(--font-display); font-weight: 800; font-size: var(--text-h2);
  color: var(--navy-600); letter-spacing: var(--tracking-tight); line-height: 1.2;
  margin: 0 0 var(--space-6);
}
.story-grid h2 em { font-style: italic; }
.story-grid p {
  color: var(--navy-600); font-weight: 500; line-height: 1.65;
  text-align: justify; margin: 0 0 var(--space-6);
}
.story-grid p:last-child { margin: 0; }
.story-grid img { width: 100%; height: auto; border-radius: var(--radius-md); }

/* ── Kontakti map ── */
.map-section { display: grid; grid-template: 500px / 1fr; }
#map-leaflet { grid-column: 1; grid-row: 1; }
.map-card {
  grid-column: 1; grid-row: 1;
  justify-self: end; align-self: stretch; z-index: 10;
  margin-right: 120px; margin-top: 32px; margin-bottom: 32px;
  width: 340px; box-sizing: border-box;
  background: #fff; box-shadow: var(--shadow-card);
  padding: var(--space-8) var(--space-6); display: flex; flex-direction: column;
  justify-content: center; gap: var(--space-10); text-align: center;
}
.map-card-item { display: flex; flex-direction: column; align-items: center; gap: var(--space-2); }
.map-card-item svg { color: var(--ink); }
.map-card-label {
  font-family: var(--font-display); font-weight: 800; font-size: var(--text-label);
  letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--ink);
  margin-top: var(--space-2);
}
.map-card-value { font-weight: 700; font-size: var(--text-sm); color: var(--ink); }
.map-card-sub { font-size: var(--text-sm); color: var(--gray-500); }

/* ── Footer ── */
.footer { background: var(--navy-700); color: #fff; }
.footer-grid {
  display: grid; grid-template-columns: 1fr 1.1fr auto; gap: var(--space-12);
  padding-top: var(--section-y-sm); padding-bottom: var(--space-10);
}
.footer-label {
  color: rgba(255,255,255,0.6); font-size: var(--text-label); font-weight: 700;
  letter-spacing: var(--tracking-label); text-transform: uppercase; margin-bottom: var(--space-5);
}
.footer-strong { font-weight: 700; margin: 0 0 var(--space-5); }
.footer-blue { color: var(--blue-300); font-weight: 700; margin: 0 0 4px; }
.footer-muted { color: rgba(255,255,255,0.82); margin: 0 0 var(--space-4); font-size: var(--text-sm); font-weight: 500; }
.footer-details { color: rgba(255,255,255,0.82); font-size: var(--text-sm); line-height: 1.85; font-weight: 500; }
.footer-muted a, .footer-details a { color: inherit; text-decoration: none; }
.footer-logo { display: flex; justify-content: flex-end; align-items: flex-start; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.22); }
.footer-bottom .container { padding-top: var(--space-5); padding-bottom: var(--space-5); }
.footer-bottom p { margin: 0; color: rgba(255,255,255,0.6); font-size: var(--text-xs); font-weight: 500; }
.footer-bottom a { color: rgba(255,255,255,0.8); font-weight: 700; }
.footer-bottom a:hover { color: #fff; }

/* ── Responsive ── */
@media (max-width: 760px) {
  .map-section { grid-template: 360px auto / 1fr; }
  #map-leaflet { grid-column: 1; grid-row: 1; }
  .map-card {
    grid-column: 1; grid-row: 2;
    justify-self: stretch; align-self: auto;
    margin: 0; width: 100%; box-shadow: none; border-top: 1px solid var(--gray-200);
    flex-direction: row; flex-wrap: wrap; justify-content: center;
    gap: var(--space-8); padding: var(--space-8) var(--gutter);
  }
}

@media (max-width: 1024px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .svc-grid { grid-template-columns: 1fr; row-gap: var(--space-12); }
  .story-grid { grid-template-columns: 1fr; gap: var(--space-10); }
}

@media (max-width: 760px) {
  /* Header */
  .hdr-logo { height: 30px; }
  .hdr-wrap { padding: 14px 20px; }
  .hdr-burger { display: flex; }
  .hdr-nav {
    display: none;
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--navy-600); padding: 8px 0 12px;
    box-shadow: 0 12px 30px rgba(20,42,64,0.25);
  }
  .hdr-nav.open { display: flex; }
  .hdr-nav a { font-size: 13px; padding: 14px 24px; }
  .hdr-nav a.nav-active { padding-bottom: 14px; }
  .hdr-nav a.nav-active::after { display: none; }

  /* Hero */
  .hero-pad { padding: 104px 20px 56px; }
  .hero-text h1, .hero-text-narrow h1 { font-size: 31px; }
  .hero-text p, .hero-text-narrow p { font-size: var(--text-body-lg); }

  /* Partners */
  .partners-row { flex-wrap: wrap; justify-content: center; gap: 12px 24px; padding: 28px 20px; }
  .partners-row img { height: 48px; max-width: 38%; }

  /* Services grid */
  .services-grid { grid-template-columns: repeat(2, 1fr); }

  /* Stats */
  .stats-grid { grid-template-columns: repeat(2, 1fr); row-gap: var(--space-8); }
  .stat-divider { border-left: none; }

  /* Coverage */
  .coverage-inner { min-height: 440px; }
  .coverage-map { background-position: 66% center; }
  .coverage-copy {
    background: rgba(255,255,255,0.62);
    backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
    padding: 32px 36px; gap: var(--space-6); max-width: 300px;
  }

  /* Contact */
  .contact-grid { grid-template-columns: 1fr; gap: var(--space-6); }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr; gap: var(--space-10); }
  .footer-logo { justify-content: flex-start; }
}

@media (max-width: 480px) {
  .services-grid { grid-template-columns: 1fr; }
}