/* ============================================================
   JŪSU JUMTI — projekta āda ("gaišs inženierisks")
   Skice: skices/skice-hero-a-desktop.png (APSTIPRINĀTA 2026-08-15)

   Likums: šeit TIKAI var(--…) atsauces, nekad tiešs hex.
   Struktūru dod primitives.css, mērogu — fluid-scale.css.
   ============================================================ */

/* ---------------------------------------------- pamati */

body {
  background: var(--color-bg);
  color: var(--color-ink);
  font-family: var(--font-body);
  font-size: var(--text-md);
  line-height: 1.65;
}

h1, h2, h3, h4 {
  color: var(--color-heading);
  font-family: var(--font-display);
  font-weight: 700;
  /* ⚠️ Kondensētajam displejam ar CAPS garumzīmēm (Ā Ē Ī Ū) vajag ≥1.12 —
     pie 1.05 makrons tiek nogriezts. Pārbaudīts 2026-08-15. */
  line-height: 1.14;
  letter-spacing: -0.005em;
  text-wrap: balance;
}

h3 { font-family: var(--font-display); font-size: var(--text-xl); }
h4 { font-size: var(--text-md); }

a { color: var(--color-accent); }
a:hover { color: var(--color-accent-hover); }

strong { font-weight: 600; }

:focus-visible {
  outline: 3px solid var(--color-accent);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* Universāls sargs: [hidden] nedrīkst zaudēt pret display:grid/flex */
[hidden] { display: none !important; }

.skip-link {
  position: absolute;
  inset-inline-start: var(--space-3);
  inset-block-start: -100px;
  z-index: 100;
  padding: 0.75rem 1.25rem;
  background: var(--color-accent);
  color: var(--color-on-accent);
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: inset-block-start var(--dur) var(--ease);
}
.skip-link:focus { inset-block-start: var(--space-3); }

/* ---------------------------------------------- sekciju karkass */

.section--alt { background: var(--color-bg-alt); }
.section--pirmais { padding-block-start: var(--space-6); }

.sek-galva {
  max-width: 62ch;
  margin-block-end: var(--space-6);
}
.sek-galva h2 { margin-block: var(--space-2) 0; }
.sek-galva .lead { margin-block-start: var(--space-3); }

.sek-beigas {
  margin-block-start: var(--space-5);
  text-align: center;
}

/* Iekšlapu galva */
.lapas-galva {
  padding-block: var(--space-6) var(--space-5);
  background: var(--color-bg-alt);
  border-block-end: 1px solid var(--color-line);
}
.lapas-galva__teksts { max-width: 68ch; }
.lapas-galva h1 { font-size: var(--text-3xl); margin-block: var(--space-2) 0; }
.lapas-galva .lead { margin-block-start: var(--space-3); }

.celins { margin-block-end: var(--space-4); }
.celins ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}
.celins li + li::before {
  content: "/";
  margin-inline-end: 0.5rem;
  color: var(--color-line);
}
.celins a { text-decoration: none; }
.celins a:hover { text-decoration: underline; }

/* ---------------------------------------------- hero */

.hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--color-bg-alt);
  padding-block-start: var(--header-h);
}

.hero__media {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
}

/* Tehniskā rasējuma režģis + gaišais mazgājums, lai teksts paliek lasāms.
   Mazgājums iet no KREISĀS puses, tāpēc foto labajā pusē paliek pilnā kontrastā
   (skice A). Šaurā ekrānā virziens mainās uz vertikālu — skat. media query. */
.hero__grid {
  position: absolute;
  inset: 0;
  z-index: -1;
  /* Režģis ir PIRMS mazgājuma, tātad virs tā — citādi gaišajā pusē tas
     pilnībā pazustu un lasītos tikai virs foto. */
  background-image:
    repeating-linear-gradient(to right,
      color-mix(in srgb, var(--color-accent) 16%, transparent) 0 1px,
      transparent 1px 72px),
    repeating-linear-gradient(to bottom,
      color-mix(in srgb, var(--color-accent) 16%, transparent) 0 1px,
      transparent 1px 72px),
    linear-gradient(to right,
      var(--color-bg) 0%,
      color-mix(in srgb, var(--color-bg) 92%, transparent) 34%,
      color-mix(in srgb, var(--color-bg) 55%, transparent) 52%,
      transparent 74%),
    linear-gradient(to bottom,
      color-mix(in srgb, var(--color-bg) 55%, transparent) 0%,
      transparent 22%);
}

.hero__wrap { position: relative; }

.hero__teksts {
  /* Skaitļu josla ir parastajā plūsmā zem šī bloka, tāpēc te nevajag vietu
     tai atstāt ar apakšējo atkāpi — citādi hero izaug pāri ekrāna augstumam. */
  padding-block: clamp(56px, 8vw, 104px) clamp(48px, 7vw, 88px);
}
/* Platumu ierobežo teksta rindas, NEVIS konteiners — citādi pogu .cluster
   sabrūk vertikāli, jo 34ch nepietiek divām pogām blakus. */
.hero__teksts h1 {
  font-size: var(--text-4xl);
  max-width: 15ch;
  margin-block: var(--space-3) var(--space-4);
}
.hero__teksts .lead {
  color: var(--color-ink);
  max-width: 38ch;
  margin-block-end: var(--space-5);
}
.hero__teksts .eyebrow { max-width: 34ch; }

/* Uz foto fona caurspīdīga ghost poga ar gaišu apmali pazūd — hero variantam
   dodam necaurspīdīgu pildījumu un akcenta apmali (kā skicē A). */
.hero .btn--ghost {
  background: var(--color-surface);
  border-color: var(--color-accent);
  color: var(--color-accent);
}
.hero .btn--ghost:hover {
  background: var(--color-accent-soft);
  color: var(--color-accent-hover);
}

/* Skaitļu josla — balta sloksne, kas pārklāj hero apakšu */
.skaitli {
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  margin-block-end: calc(var(--space-6) * -0.5);
  overflow: hidden;
}
.skaitli__viens {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.5ch;
  padding: var(--space-4);
  border-inline-start: 1px solid var(--color-line);
}
.skaitli__viens:first-child { border-inline-start: 0; }
.skaitli__vertiba {
  font-family: var(--font-display);
  font-size: var(--text-2xl);
  font-weight: 700;
  color: var(--color-accent);
  font-variant-numeric: tabular-nums;
}
.skaitli__teksts { color: var(--color-ink-muted); font-size: var(--text-sm); }

/* Atstarpe zem hero, lai skaitļu josla nepārklāj nākamo sekciju */
.hero + .section { padding-block-start: calc(var(--space-7) + var(--space-4)); }

/* ---------------------------------------------- pakalpojumu kartītes */

.pak-regis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr));
  gap: var(--space-4);
}

.pak-kartite {
  position: relative;
  padding: var(--space-5) var(--space-4) var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
  transition: border-color var(--dur) var(--ease),
              box-shadow var(--dur) var(--ease),
              transform var(--dur) var(--ease);
}
.pak-kartite:hover,
.pak-kartite:focus-within {
  border-color: var(--color-accent);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}
.pak-kartite__nr {
  position: absolute;
  inset-block-start: var(--space-4);
  inset-inline-end: var(--space-4);
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 600;
  color: var(--color-line);
}
.pak-kartite h2,
.pak-kartite h3 { margin-block-end: var(--space-2); padding-inline-end: 3ch; }
.pak-kartite h2 { font-size: var(--text-xl); }
.pak-kartite a { text-decoration: none; }
/* Visa kartīte kļūst klikšķināma, bet fokusējams paliek tikai virsraksta links */
.pak-kartite h2 a::after,
.pak-kartite h3 a::after { content: ""; position: absolute; inset: 0; }
.pak-kartite p { color: var(--color-ink-muted); margin: 0; }
.pak-kartite__vairak {
  display: inline-block;
  margin-block-start: var(--space-3);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--color-accent);
}

.pak-saraksts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr));
  gap: var(--space-4);
}
.pak-kartite--plata p { margin-block-end: var(--space-4); }
.pak-kartite--plata .btn { position: relative; z-index: 1; }

/* ---------------------------------------------- kāpēc mēs */

.kapec-regis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr));
  gap: var(--space-4);
}
.kapec-kartite {
  padding-block-start: var(--space-4);
  border-block-start: 3px solid var(--color-accent);
}
.kapec-kartite h3 { margin-block-end: var(--space-2); }
.kapec-kartite p { color: var(--color-ink-muted); margin: 0; }

/* ---------------------------------------------- process */

.process {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: var(--space-5);
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: solis;
}
.solis { position: relative; padding-block-start: var(--space-4); }
.solis::before {
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  height: 1px;
  background: var(--color-line);
}
.solis__nr {
  display: block;
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--color-accent);
  margin-block-end: var(--space-2);
}
.solis h3 { margin-block-end: var(--space-2); }
.solis p { color: var(--color-ink-muted); margin: 0; }

/* ---------------------------------------------- galerija */

.cipi { margin-block-end: var(--space-4); }
.cips {
  display: inline-flex;
  align-items: center;
  gap: 0.6ch;
  min-height: 44px;
  padding: 0.5rem 1.1rem;
  font: inherit;
  font-weight: 500;
  color: var(--color-ink);
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-pill);
  cursor: pointer;
  transition: background var(--dur) var(--ease),
              border-color var(--dur) var(--ease),
              color var(--dur) var(--ease);
}
.cips span { color: var(--color-ink-muted); font-size: var(--text-sm); }
.cips:hover { border-color: var(--color-accent); }
.cips.is-active {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: var(--color-on-accent);
}
.cips.is-active span { color: var(--color-on-accent); opacity: 0.75; }

.gal__skaits {
  margin-block: 0 var(--space-4);
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}

.gal {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(230px, 100%), 1fr));
  gap: var(--space-3);
}
/* 3 kolonnas, nevis 4: izlasē ir 9 foto un saistītajos 6 — abi dalās ar 3
   un neatstāj bāreņa rindu ar vienu flīzi. */
.gal--izlase,
.gal--saistitie {
  grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr));
}

.gal__item { margin: 0; }
.gal__item a {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md);
  background: var(--color-bg-alt);
}
.gal__item img {
  display: block;
  width: 100%;
  height: auto;          /* ⚠️ vajadzīgs, jo width/height atribūti ir 800×800 */
  aspect-ratio: 1;
  object-fit: cover;
  transition: transform 480ms var(--ease);
}
.gal__item a::after {
  content: "";
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--color-accent) 45%, transparent);
  opacity: 0;
  transition: opacity var(--dur) var(--ease);
}
.gal__item a:hover img,
.gal__item a:focus-visible img { transform: scale(1.04); }
.gal__item a:hover::after,
.gal__item a:focus-visible::after { opacity: 1; }

/* ---------------------------------------------- teksta lapas / sānjosla */

.saturs-bloks h2 {
  font-size: var(--text-2xl);
  margin-block: var(--space-5) var(--space-3);
}
.saturs-bloks > h2:first-child { margin-block-start: 0; }
.saturs-bloks h3 { margin-block: var(--space-4) var(--space-2); }
.saturs-bloks p { margin-block-end: var(--space-3); }

.teksts-lapa { max-width: 72ch; }
/* Rekvizītu bloks tikpat plats kā teksts — citādi definīciju saraksts
   izstiepjas pār visu 1200px un dt/dd pāri atraujas viens no otra. */
.rekviziti { max-width: 72ch; }
.teksts-lapa p, .teksts-lapa li { color: var(--color-ink); }

.kekši { list-style: none; padding: 0; margin: 0 0 var(--space-4); }
.kekši li {
  position: relative;
  padding-inline-start: 2rem;
  margin-block-end: var(--space-3);
  color: var(--color-ink-muted);
}
/* Īsts ķeksis, nevis "v": svītrām jābūt DAŽĀDA garuma (7×12), citādi
   pagrieztais stūris izskatās kā simetrisks burts. */
.kekši li::before {
  content: "";
  position: absolute;
  inset-inline-start: 2px;
  inset-block-start: 0.35em;
  width: 7px;
  height: 12px;
  border-inline-end: 2px solid var(--color-accent);
  border-block-end: 2px solid var(--color-accent);
  transform: rotate(45deg);
}
.teksts-lapa .kekši li { color: var(--color-ink); }

.faq__viens {
  border-block-end: 1px solid var(--color-line);
  padding-block: var(--space-3);
}
.faq__viens summary {
  cursor: pointer;
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 600;
  color: var(--color-heading);
  line-height: 1.25;
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
}
.faq__viens summary::-webkit-details-marker { display: none; }
.faq__viens summary::after {
  content: "+";
  flex: none;
  font-weight: 400;
  color: var(--color-accent);
}
.faq__viens[open] summary::after { content: "–"; }
.faq__viens p { margin-block: var(--space-3) 0; color: var(--color-ink-muted); }

.sanjosla {
  position: sticky;
  top: calc(var(--header-h) + var(--space-3));
  align-self: start;
  padding: var(--space-4);
  background: var(--color-bg-alt);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
}
.sanjosla__virsraksts { font-size: var(--text-md); margin-block-end: var(--space-3); }
.sanjosla__saraksts { list-style: none; padding: 0; margin: 0 0 var(--space-4); }
.sanjosla__saraksts li + li { margin-block-start: 0.5rem; }
.sanjosla__saraksts a { text-decoration: none; }
.sanjosla__saraksts a:hover { text-decoration: underline; }
.sanjosla__cta {
  padding-block-start: var(--space-4);
  border-block-start: 1px solid var(--color-line);
}
.sanjosla__cta p { font-weight: 600; margin-block-end: var(--space-3); }
.sanjosla__tel {
  display: block;
  margin-block-start: var(--space-3);
  text-align: center;
  font-family: var(--font-display);
  font-size: var(--text-lg);
  font-weight: 600;
  text-decoration: none;
}

/* Rekvizīti un kontaktu meta */
.rekviziti dl, .kontakti-bloks__meta { margin: 0; }
.rekviziti dl > div,
.kontakti-bloks__meta > div {
  display: grid;
  grid-template-columns: minmax(140px, 34%) 1fr;
  gap: var(--space-3);
  padding-block: var(--space-3);
  border-block-end: 1px solid var(--color-line);
}
.rekviziti dt, .kontakti-bloks__meta dt {
  color: var(--color-ink-muted);
  font-size: var(--text-sm);
}
.rekviziti dd, .kontakti-bloks__meta dd { margin: 0; }
.rekviziti h2 { margin-block-end: var(--space-3); }

/* Tabula (sīkdatņu politika) */
.tabula-ietvars { overflow-x: auto; margin-block: var(--space-4); }
/* min-width + ietvara overflow-x: šaurumā tabula ritinās, nevis saspiež
   kolonnas tik ļoti, ka sīkdatnes nosaukums lūzt pa vidu. */
.tabula { width: 100%; min-width: 620px; border-collapse: collapse; font-size: var(--text-sm); }
.tabula caption {
  text-align: start;
  color: var(--color-ink-muted);
  padding-block-end: var(--space-2);
}
.tabula th, .tabula td {
  padding: var(--space-3);
  text-align: start;
  border-block-end: 1px solid var(--color-line);
  vertical-align: top;
}
.tabula th { background: var(--color-bg-alt); font-weight: 600; white-space: nowrap; }
.tabula code { font-size: 0.92em; white-space: nowrap; }

/* ---------------------------------------------- kontaktu lapa */

.kontakti-bloks {
  align-self: start;
  padding: var(--space-4);
  background: var(--color-bg-alt);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-md);
}
.kontakti-bloks h2 { font-size: var(--text-xl); margin-block-end: var(--space-3); }
.kontakti-bloks__liels {
  display: block;
  font-family: var(--font-display);
  font-size: var(--text-xl);
  font-weight: 600;
  text-decoration: none;
  margin-block-end: var(--space-2);
  overflow-wrap: anywhere;
}
.kontakti-bloks__meta { margin-block-start: var(--space-4); }
.kontakti-bloks__meta > div:last-child { border-block-end: 0; }
.kontakti-bloks__disc {
  margin-block: var(--space-3) 0;
  font-size: var(--text-xs);
  color: var(--color-ink-muted);
}

.forma-bloks h2 { font-size: var(--text-2xl); margin-block-end: var(--space-4); }
.fw-piezime {
  margin-block-start: var(--space-3);
  font-size: var(--text-sm);
  color: var(--color-ink-muted);
}

/* ---------------------------------------------- CTA josla */

.cta-josla {
  padding-block: var(--space-6);
  background: var(--color-accent);
  color: var(--color-on-accent);
}
.cta-josla__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
}
.cta-josla h2 { color: var(--color-on-accent); margin-block-end: var(--space-2); }
.cta-josla p { margin: 0; max-width: 48ch; opacity: 0.9; }

/* Pogas uz akcenta fona — apgriezti toņi */
.cta-josla .btn--primary {
  background: var(--color-on-accent);
  color: var(--color-accent);
  border-color: var(--color-on-accent);
}
.cta-josla .btn--primary:hover {
  background: var(--color-accent-soft);
  color: var(--color-accent-hover);
  border-color: var(--color-accent-soft);
}
.cta-josla .btn--ghost {
  color: var(--color-on-accent);
  border-color: color-mix(in srgb, var(--color-on-accent) 55%, transparent);
}
.cta-josla .btn--ghost:hover {
  background: color-mix(in srgb, var(--color-on-accent) 14%, transparent);
  color: var(--color-on-accent);
  border-color: var(--color-on-accent);
}

/* ---------------------------------------------- navigācijas precizējumi */

.navb__brand img { display: block; height: 48px; width: auto; }
.navb__link.is-active { color: var(--color-accent); font-weight: 600; }
.navb__link--tel { font-weight: 600; }

@media (min-width: 900px) {
  /* Telefonu galvenē rāda tikai plašā ekrānā — mobilajā tas ir izvēlnē */
  .navb__link--tel { margin-inline-start: var(--space-3); }
}

.footer__brand img { display: block; height: 52px; width: auto; }

/* ---------------------------------------------- responsīvie precizējumi */

@media (max-width: 860px) {
  /* Šaurā ekrānā teksts vairs nav sānis no foto — mazgājums jāgriež vertikāli,
     citādi virsraksts nokļūst uz tumšās jumta plaknes. */
  .hero__grid {
    background-image:
      repeating-linear-gradient(to right,
        color-mix(in srgb, var(--color-accent) 16%, transparent) 0 1px,
        transparent 1px 72px),
      repeating-linear-gradient(to bottom,
        color-mix(in srgb, var(--color-accent) 16%, transparent) 0 1px,
        transparent 1px 72px),
      linear-gradient(to bottom,
        var(--color-bg) 0%,
        color-mix(in srgb, var(--color-bg) 92%, transparent) 46%,
        color-mix(in srgb, var(--color-bg) 45%, transparent) 74%,
        transparent 100%);
  }
}

@media (max-width: 720px) {
  .hero__teksts { max-width: none; }
  .skaitli__viens { border-inline-start: 0; border-block-start: 1px solid var(--color-line); }
  .skaitli__viens:first-child { border-block-start: 0; }
  .cta-josla__inner { align-items: flex-start; }
  .rekviziti dl > div,
  .kontakti-bloks__meta > div { grid-template-columns: 1fr; gap: 0.25rem; }
  .sanjosla { position: static; }
}

/* ---------------------------------------------- kustības samazināšana */

@media (prefers-reduced-motion: reduce) {
  .pak-kartite,
  .gal__item img,
  .gal__item a::after { transition: none; }
  .pak-kartite:hover { transform: none; }
  .gal__item a:hover img { transform: none; }
}
