:root {
  --meri: #163a4a;
  --meri-tume: #0e2833;
  --mets: #2c5e45;
  --mets-hele: #3f7a5a;
  --rukkilill: #4b7dc1;
  --rukkilill-hele: #d6e4f5;
  --mari: #8a3d4d;
  --kuld: #b0893e;
  --liiv: #f3ebdd;
  --paber: #fbf7f0;
  --paber-tume: #efe6d6;
  --tint: #1c2420;
  --vaikne: #5c665f;
  --joon: #d9ccb6;
  --kaart: #fffdf8;
  --vari: 0 10px 30px rgba(22, 58, 74, 0.08);
  --raadius: 18px;
  --serif: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
  --sans: "Source Sans 3", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --nav-korgus: 4.15rem;
  --bs-body-font-family: var(--sans);
  --bs-body-font-size: 1.05rem;
  --bs-body-color: var(--tint);
  --bs-body-bg: var(--paber);
  --bs-primary: var(--meri);
  --bs-primary-rgb: 22, 58, 74;
  --bs-secondary: var(--mets);
  --bs-link-color: var(--rukkilill);
  --bs-link-hover-color: var(--meri);
  --bs-border-color: var(--joon);
  --bs-border-radius: 12px;
  --bs-border-radius-pill: 999px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--nav-korgus) + 0.55rem);
}

body {
  margin: 0;
  color: var(--tint);
  background:
    radial-gradient(1200px 500px at 10% -10%, rgba(75, 125, 193, 0.12), transparent 50%),
    radial-gradient(900px 400px at 100% 0%, rgba(44, 94, 69, 0.1), transparent 45%),
    var(--paber);
  font-family: var(--sans);
  font-size: 1.05rem;
  line-height: 1.55;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--rukkilill); }
a:hover { color: var(--meri); }

.vahele {
  position: absolute;
  left: -999px;
  top: 0;
  background: var(--meri);
  color: #fff;
  padding: 0.6rem 1rem;
  z-index: 20;
}
.vahele:focus { left: 0.6rem; top: 0.6rem; }

.pais-riba.navbar {
  min-height: var(--nav-korgus);
  background: color-mix(in srgb, var(--meri-tume) 94%, black);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(240, 212, 138, 0.2);
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
}
.pais-riba .navbar-brand,
.riba-nimi {
  font-family: var(--serif);
  font-weight: 600;
  font-size: 1.08rem;
  color: #f7f3ea;
  text-decoration: none;
  white-space: nowrap;
}
.pais-riba .navbar-brand:hover,
.pais-riba .navbar-brand:focus-visible,
.riba-nimi:hover,
.riba-nimi:focus-visible {
  color: #fff;
}
.pais-riba .navbar-toggler {
  border: 1px solid rgba(247, 243, 234, 0.45);
  background: rgba(255, 255, 255, 0.08);
  color: #f7f3ea;
  border-radius: 999px;
  padding: 0.35rem 0.7rem;
  font-size: 1.35rem;
  line-height: 1;
}
.pais-riba .navbar-toggler:hover,
.pais-riba .navbar-toggler:focus-visible {
  background: #fff;
  color: var(--meri);
  border-color: #fff;
}
.pais-riba .navbar-toggler:focus {
  box-shadow: 0 0 0 0.2rem rgba(240, 212, 138, 0.35);
}
.pais-riba .navbar-nav {
  align-items: center;
  gap: 0.2rem;
}
.pais-riba .nav-link {
  color: #efe7d7;
  font-weight: 650;
  font-size: 0.95rem;
  padding: 0.42rem 0.8rem;
  border-radius: 999px;
}
.pais-riba .nav-link .bi {
  margin-right: 0.28rem;
}
.pais-riba .nav-link:hover,
.pais-riba .nav-link:focus-visible {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}
.pais-riba .nav-link.active,
.pais-riba .nav-link[aria-current="page"] {
  background: #fff;
  color: var(--meri);
}
.pais-riba .nav-link.menyy-varskenda {
  border: 1px solid rgba(247, 243, 234, 0.4);
}

@media (max-width: 991.98px) {
  .pais-riba .navbar-nav {
    align-items: stretch;
    padding: 0.35rem 0 0.2rem;
    gap: 0.35rem;
  }
  .pais-riba .nav-item {
    width: 100%;
  }
  .pais-riba .nav-link {
    background: rgba(255, 255, 255, 0.06);
    padding: 0.7rem 0.9rem;
  }
  .pais-riba .nav-link.active,
  .pais-riba .nav-link[aria-current="page"] {
    background: #fff;
    color: var(--meri);
  }
}

.container,
.container-fluid,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
  width: 100%;
  max-width: none;
  padding-left: clamp(1rem, 3.5vw, 2.75rem);
  padding-right: clamp(1rem, 3.5vw, 2.75rem);
}

@media (min-width: 576px) {
  .container,
  .container-sm { max-width: none; }
}
@media (min-width: 768px) {
  .container,
  .container-md { max-width: none; }
}
@media (min-width: 992px) {
  .container,
  .container-lg { max-width: none; }
}
@media (min-width: 1200px) {
  .container,
  .container-xl { max-width: none; }
}
@media (min-width: 1400px) {
  .container,
  .container-xxl { max-width: none; }
}

.pais {
  position: relative;
  overflow: hidden;
  color: #f7f3ea;
  background:
    linear-gradient(160deg, rgba(14, 40, 51, 0.55), rgba(22, 58, 74, 0.35)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cpath fill='none' stroke='%23ffffff14' d='M0 40h80M40 0v80'/%3E%3C/svg%3E"),
    linear-gradient(160deg, var(--meri-tume), var(--mets) 70%, #1e4a38);
  padding: 2.6rem 0 2.4rem;
}

.pais-vaike {
  padding: 1.8rem 0 1.7rem;
}
.pais-vaike h1 {
  font-size: clamp(1.75rem, 4vw, 2.55rem);
  margin: 0 0 0.45rem;
  max-width: none;
}
.pais-vaike .lead {
  margin-bottom: 0;
  font-size: 1.05rem;
  max-width: none;
}

.avaleht {
  color: inherit;
  text-decoration: none;
}
.avaleht:hover,
.avaleht:focus-visible {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

.silt {
  display: inline-block;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.78rem;
  font-weight: 700;
  color: #f0d48a;
  margin: 0 0 0.7rem;
}

.pais h1 {
  font-family: var(--serif);
  font-weight: 600;
  font-size: clamp(2.1rem, 5vw, 3.6rem);
  line-height: 1.12;
  margin: 0 0 0.8rem;
  max-width: none;
}

.pais .lead {
  max-width: 72rem;
  margin: 0 0 1.4rem;
  font-size: 1.12rem;
  color: #efe7d7;
}

.pais-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1.1rem;
  font-size: 0.95rem;
  color: #e4dccb;
}

.pais-meta strong { color: #fff; font-weight: 700; }
.pais-meta a { color: #f0d48a; }

.kest {
  padding-top: 1.6rem;
  padding-bottom: 4rem;
}

.hoiatus-kest {
  margin-top: -1.4rem;
  margin-bottom: 0.4rem;
}

.alert.hoiatus,
.hoiatus {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  background: #fff8e8;
  border: 1px solid #ead7a4;
  border-left: 5px solid var(--kuld);
  border-radius: 12px;
  padding: 1rem 1.15rem;
  color: #4a3d1f;
  margin: 0;
  min-width: 0;
  max-width: 100%;
}

.alert.hoiatus .bi {
  color: var(--kuld);
  flex: 0 0 auto;
  margin-top: 0.15rem;
}

.alert.hoiatus > p,
.hoiatus p {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  overflow-wrap: break-word;
}

.alert.hoiatus em,
.hoiatus em {
  font-style: italic;
  overflow-wrap: anywhere;
}

.hoiatus a { color: #6b4e12; font-weight: 650; }

.riist {
  position: static;
  background: color-mix(in srgb, var(--paber) 88%, white);
  border: 1px solid var(--joon);
  border-radius: var(--raadius);
  padding: 0.75rem 0.9rem 0.8rem;
  box-shadow: var(--vari);
  margin-bottom: 1.15rem;
}

.riist .input-group {
  min-width: 0;
  flex-wrap: nowrap;
}
.riist .input-group-text {
  background: #fff;
  border-color: var(--joon);
  color: var(--vaikne);
  border-radius: 999px 0 0 999px;
}
.riist .form-control.otsing,
.otsing {
  width: 100%;
  min-width: 0;
  border: 1px solid var(--joon);
  background: #fff;
  border-radius: 0 999px 999px 0;
  padding: 0.72rem 1.1rem;
  font: inherit;
  font-size: 16px;
  color: var(--tint);
}
.riist .form-control.otsing:focus,
.otsing:focus {
  outline: none;
  border-color: var(--rukkilill);
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--rukkilill) 25%, transparent);
}

.filtrid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.65rem;
}

.chip,
.chip.btn {
  --bs-btn-bg: #fff;
  --bs-btn-border-color: var(--joon);
  --bs-btn-color: var(--meri);
  --bs-btn-hover-bg: var(--meri);
  --bs-btn-hover-border-color: var(--meri);
  --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: var(--meri);
  --bs-btn-active-border-color: var(--meri);
  --bs-btn-active-color: #fff;
  appearance: none;
  border: 1px solid var(--joon);
  background: #fff;
  color: var(--meri);
  border-radius: 999px;
  padding: 0.32rem 0.85rem;
  font: inherit;
  font-size: 0.92rem;
  min-height: 2.4rem;
  cursor: pointer;
}
.chip[aria-pressed="true"],
.chip:hover {
  background: var(--meri);
  color: #fff;
  border-color: var(--meri);
}

.riist-jalus {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem 1rem;
  margin-top: 0.6rem;
  padding-top: 0.55rem;
  border-top: 1px dashed var(--joon);
}
#tulemuste-arv {
  color: var(--vaikne);
  font-size: 0.95rem;
}

.kogused {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.4rem;
  margin: 0;
  padding: 0;
  border: 0;
}
.kogused-silt {
  font-weight: 650;
  color: var(--meri);
  margin-right: 0.2rem;
}
.kogus,
.kogus.btn {
  --bs-btn-bg: #fff;
  --bs-btn-border-color: var(--joon);
  --bs-btn-color: var(--meri);
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: var(--mets);
  --bs-btn-hover-color: var(--mets);
  appearance: none;
  min-width: 2.75rem;
  min-height: 2.75rem;
  height: 2.75rem;
  padding: 0 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--joon);
  background: #fff;
  color: var(--meri);
  font: inherit;
  font-weight: 750;
  line-height: 1;
  cursor: pointer;
}
.kogus:hover {
  border-color: var(--mets);
  color: var(--mets);
}
.kogus[aria-checked="true"] {
  background: var(--mets);
  color: #fff;
  border-color: var(--mets);
}
.kogus:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--mets) 40%, transparent);
  outline-offset: 2px;
}
.kogused-yhik {
  color: var(--vaikne);
  font-size: 0.95rem;
}

.ports-valitud { color: var(--mets); font-weight: 650; }

.riist-pea .form-label {
  color: var(--vaikne);
  font-size: 0.85rem;
}
.riist-pea > [class*="col"] { min-width: 0; }
.riist-pea .form-select {
  border-color: var(--joon);
  color: var(--tint);
  min-width: 0;
  width: 100%;
}
@media (min-width: 768px) {
  .riist-pea .form-select { min-width: 10.5rem; }
}
.riist-pea .form-select:focus {
  border-color: var(--rukkilill);
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--rukkilill) 25%, transparent);
}

.kaart-veerg {
  display: flex;
}
.kaart-veerg .kaart { flex: 1 1 auto; }
.kaart-veerg[hidden] { display: none !important; }

.kaart {
  width: 100%;
  background: var(--kaart);
  border: 1px solid var(--joon);
  border-radius: var(--raadius);
  overflow: hidden;
  box-shadow: var(--vari);
}

.kaart[hidden] { display: none !important; }

.kaart > summary {
  list-style: none;
  cursor: pointer;
}
.kaart > summary::-webkit-details-marker { display: none; }

.pilt {
  aspect-ratio: 16 / 10;
  background: var(--paber-tume);
  overflow: hidden;
}
.pilt img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.kaart-keha { padding: 0.9rem 1rem 1.05rem; }

.kaart h2 {
  font-family: var(--serif);
  font-size: 1.28rem;
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 0.35rem;
  overflow-wrap: anywhere;
}

.ports {
  margin: 0 0 0.45rem;
  color: var(--vaikne);
  font-size: 0.92rem;
}

h3 small {
  font-family: var(--sans);
  font-weight: 400;
  color: var(--vaikne);
  font-size: 0.85rem;
}

.meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0.55rem;
}

.pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.12rem 0.55rem;
  font-size: 0.78rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  background: var(--rukkilill-hele);
  color: #1d3a66;
}
.pill.raskus-lihtne { background: #e1f0e4; color: #215c36; }
.pill.raskus-keskmine { background: #f7ead0; color: #6a4a12; }
.pill.raskus-noudlik { background: #f3dce0; color: #7a2436; }
.pill.ckd { background: #e8eef6; color: var(--meri); }

.mineraalid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.35rem;
  margin: 0.35rem 0 0.15rem;
}
.mineraal {
  background: var(--liiv);
  border-radius: 10px;
  padding: 0.35rem 0.4rem;
  text-align: center;
}
.mineraal b {
  display: block;
  font-size: 0.95rem;
  color: var(--meri);
  overflow-wrap: anywhere;
}
.mineraal span {
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--vaikne);
}

.avatud-vihje {
  margin: 0.55rem 0 0;
  font-size: 0.88rem;
  color: var(--mets);
  font-weight: 650;
}

.kaart[open] .pilt { aspect-ratio: 21 / 8; max-height: 280px; }
.kaart[open] .avatud-vihje { display: none; }

.taisme {
  border-top: 1px solid var(--joon);
  padding: 0.3rem 1.05rem 1.2rem;
  background: linear-gradient(#fffdf8, #f7f1e6);
}

.taisme-paigutus {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.2rem;
}

@media (min-width: 820px) {
  .taisme-paigutus { grid-template-columns: 0.9fr 1.2fr; }
}

h3 {
  font-family: var(--serif);
  font-size: 1.15rem;
  margin: 0.4rem 0 0.5rem;
}

.ained {
  margin: 0;
  padding: 0;
  list-style: none;
}
.ained li {
  padding: 0.32rem 0;
  border-bottom: 1px dashed #eadfcd;
  overflow-wrap: anywhere;
}
.ained li.grupp {
  border-bottom: none;
  font-weight: 750;
  color: var(--mets);
  padding-top: 0.7rem;
}

.sammud {
  margin: 0;
  padding-left: 1.2rem;
}
.sammud li { margin: 0.45rem 0; overflow-wrap: anywhere; }

.markus,
.nouanne {
  border-radius: 12px;
  padding: 0.8rem 0.9rem;
  margin: 0.7rem 0 0;
}
.markus {
  background: #eaf3ea;
  border: 1px solid #c9e0cc;
}
.nouanne {
  background: #eef3fa;
  border: 1px solid #d0dced;
}
.markus p, .nouanne p { margin: 0.3rem 0 0; }
.markus p:first-child, .nouanne p:first-child { margin-top: 0; }

.allikas {
  margin: 1rem 0 0.2rem;
  font-size: 0.95rem;
}
.allikas a { font-weight: 700; }

.toite {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(140px, 100%), 1fr));
  gap: 0.4rem;
  margin: 0.4rem 0 0.8rem;
}
.toide {
  background: #fff;
  border: 1px solid var(--joon);
  border-radius: 10px;
  padding: 0.4rem 0.55rem;
  font-size: 0.9rem;
}
.toide b { display: block; color: var(--meri); }

.tyhi {
  display: none;
  text-align: center;
  padding: 2.5rem 1rem;
  color: var(--vaikne);
}
.tyhi.nahtav { display: block; }

.artikkel {
  max-width: none;
  margin: 0;
  padding-top: 2rem;
  padding-bottom: 4rem;
}
.artikkel p {
  color: var(--vaikne);
  margin: 0 0 0.85rem;
  max-width: none;
}
.kontakt-kaardid {
  margin-top: 1.6rem;
}
.kontakt-kaart {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 8.5rem;
  height: 100%;
  padding: 1.15rem 1.2rem 1.25rem;
  background: var(--kaart);
  border: 1px solid var(--joon);
  border-radius: var(--raadius);
  box-shadow: var(--vari);
  text-decoration: none;
  color: var(--mets);
}
.kontakt-kaart:hover,
.kontakt-kaart:focus-visible {
  border-color: var(--mets);
  color: var(--meri);
}
.kontakt-kaart span {
  display: block;
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--vaikne);
  margin-bottom: 0.4rem;
}
.kontakt-kaart span .bi {
  margin-right: 0.3rem;
  color: var(--mets);
}
.kontakt-kaart strong {
  font-size: 1.15rem;
  font-weight: 700;
  word-break: break-word;
}

.jalus {
  background: var(--meri-tume);
  color: #e6dece;
  padding: 2rem 0 2.4rem;
}
.jalus-sisu.jalus-lihtne { display: block; }
.jalus-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1.15rem;
  margin-top: 0.85rem;
}
.jalus-nav a { font-weight: 650; }
.jalus a { color: #f0d48a; }
.jalus p { margin: 0.4rem 0; }
.jalus h2 {
  font-family: var(--serif);
  font-size: 1.15rem;
  font-weight: 600;
  margin: 0 0 0.55rem;
  color: #fff;
}

.haldaja {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(240, 212, 138, 0.22);
  border-radius: 14px;
  padding: 1rem 1.1rem 1.15rem;
}
.haldaja ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.haldaja li {
  margin: 0.35rem 0;
}
.haldaja span {
  display: block;
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #c9c0ae;
}

.ules {
  position: fixed;
  right: 1.1rem;
  bottom: 1.1rem;
  z-index: 16;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.62rem 0.95rem 0.62rem 0.8rem;
  border-radius: 999px;
  background: var(--meri);
  color: #f7f3ea;
  text-decoration: none;
  font-weight: 650;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  box-shadow: 0 10px 24px rgba(14, 40, 51, 0.28);
}
.ules[hidden] { display: none !important; }
.ules:hover,
.ules:focus-visible {
  background: var(--mets);
  color: #fff;
}
.ules:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--mets) 45%, white);
  outline-offset: 3px;
}
.ules .bi,
.ules svg {
  width: 1.15em;
  height: 1.15em;
  flex: none;
}

@media (max-width: 399px) {
  .pais-riba .navbar-brand {
    white-space: normal;
    line-height: 1.2;
    max-width: min(14rem, calc(100vw - 5.5rem));
  }
}

@media (max-width: 575.98px) {
  .container,
  .container-fluid,
  .container-sm,
  .container-md,
  .container-lg,
  .container-xl,
  .container-xxl {
    padding-left: 0.9rem;
    padding-right: 0.9rem;
  }
  .pais {
    padding: 1.45rem 0 2.1rem;
  }
  .pais h1 {
    max-width: none;
    font-size: clamp(1.65rem, 8.2vw, 2.15rem);
  }
  .pais .lead,
  .pais-vaike .lead {
    font-size: 1.02rem;
    margin-bottom: 1rem;
  }
  .pais-riba .navbar-brand,
  .riba-nimi {
    white-space: normal;
    line-height: 1.2;
    font-size: 1rem;
    max-width: calc(100vw - 5.5rem);
  }
  .hoiatus-kest { margin-top: -1.15rem; }
  .alert.hoiatus,
  .hoiatus {
    padding: 0.85rem 0.9rem;
    gap: 0.5rem;
  }
  .riist { padding: 0.8rem 0.7rem 0.85rem; }
  .riist .form-control.otsing,
  .otsing { padding: 0.65rem 0.85rem; }
  .chip,
  .chip.btn {
    font-size: 0.88rem;
    padding: 0.28rem 0.7rem;
    min-height: 2.25rem;
  }
  .kaart-keha { padding: 0.8rem 0.85rem 0.95rem; }
  .kaart h2 { font-size: 1.12rem; }
  .mineraalid { gap: 0.28rem; }
  .mineraal { padding: 0.3rem 0.2rem; }
  .mineraal b { font-size: 0.82rem; }
  .mineraal span { font-size: 0.66rem; }
  .kontakt-kaart { min-height: 0; padding: 1rem; }
  .kest { padding-bottom: 5rem; }
  .taisme { padding-bottom: 4.2rem; }
  .ules {
    right: 0.75rem;
    bottom: 0.75rem;
    padding: 0.72rem;
    width: 2.85rem;
    height: 2.85rem;
    justify-content: center;
    font-size: 0;
  }
  .ules .bi {
    font-size: 1.2rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

@media print {
  .riist, .pais-meta, .hoiatus, .jalus, .avatud-vihje, .kogused, .ules, .pais-riba { display: none !important; }
  .pais { padding: 0.4rem 0; background: none; color: #000; }
  .pais h1 { color: #000; }
  #vork.row { display: block; }
  .kaart-veerg { display: none; }
  .kaart-veerg:has(.kaart[open]) { display: block; }
  .kaart { display: none; box-shadow: none; border: none; break-inside: avoid; }
  .kaart[open] { display: block; }
  .kaart[open] .pilt { max-height: 180px; }
}
