:root {
  --navy: #071a33;
  --navy-2: #0b2447;
  --blue: #1769ff;
  --blue-2: #2f80ff;
  --sky: #eaf3ff;
  --soft: #f6f9fd;
  --white: #ffffff;
  --text: #13233a;
  --muted: #637083;
  --border: rgba(20, 51, 88, 0.12);
  --shadow: 0 22px 70px rgba(17, 50, 92, 0.12);
  --radius: 24px;
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: "Inter", sans-serif;
  color: var(--text);
  background: var(--white);
  line-height: 1.65;
}

a { color: inherit; text-decoration: none; }

button, input, textarea { font: inherit; }

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

.container {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
}

.site-header {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  right: 0;
  border-bottom: 1px solid transparent;
  transition: .25s ease;
}

.site-header.scrolled {
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(16px);
  border-color: var(--border);
  box-shadow: 0 8px 30px rgba(7, 26, 51, 0.06);
}

.nav-wrap {
  min-height: 78px;
  display: flex;
  align-items: center;
  gap: 28px;
}

.brand {
  font-family: "Manrope", sans-serif;
  font-weight: 800;
  letter-spacing: -.04em;
  font-size: 1.35rem;
  color: var(--navy);
  margin-right: auto;
}

.brand span { color: var(--blue); }

.nav {
  display: flex;
  gap: 24px;
  align-items: center;
}

.nav a {
  font-size: .92rem;
  font-weight: 600;
  color: #30445f;
  transition: .2s ease;
}

.nav a:hover { color: var(--blue); }

.language-switcher {
  display: flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: rgba(255,255,255,.75);
}

.language-switcher button {
  border: 0;
  background: transparent;
  border-radius: 999px;
  padding: 6px 9px;
  font-size: .72rem;
  font-weight: 700;
  color: #8190a3;
}

.language-switcher button.active {
  background: var(--navy);
  color: var(--white);
}

.language-switcher button:disabled { opacity: .45; }

.nav-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  padding: 10px;
}

.nav-toggle span {
  display: block;
  height: 2px;
  background: var(--navy);
  margin: 5px 0;
  border-radius: 4px;
}

.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background:
    linear-gradient(180deg, #f9fcff 0%, #ffffff 72%);
  padding: 130px 0 80px;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(18,105,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18,105,255,.04) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(to bottom, black, transparent 78%);
}

.hero-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(20px);
  opacity: .75;
}

.glow-one {
  width: 420px;
  height: 420px;
  background: rgba(44, 131, 255, .16);
  right: 8%;
  top: 18%;
}

.glow-two {
  width: 260px;
  height: 260px;
  background: rgba(32, 210, 255, .12);
  right: 24%;
  bottom: 8%;
}

.hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 80px;
  align-items: center;
}

.eyebrow,
.section-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-transform: uppercase;
  letter-spacing: .17em;
  font-size: .74rem;
  font-weight: 800;
  color: var(--blue);
}

.eyebrow::before,
.section-label::before {
  content: "";
  width: 30px;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
}

.hero h1 {
  margin: 22px 0 14px;
  font-family: "Manrope", sans-serif;
  font-size: clamp(4rem, 8vw, 7.4rem);
  line-height: .87;
  letter-spacing: -.065em;
  color: var(--navy);
}

.hero h1 span { color: var(--blue); }

.hero-kicker {
  margin: 30px 0 10px;
  font-size: 1.28rem;
  font-weight: 700;
  color: var(--navy-2);
}

.hero-text {
  max-width: 660px;
  margin: 0 0 34px;
  font-size: 1.05rem;
  color: var(--muted);
}

.hero-actions,
.contact-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 52px;
  padding: 0 23px;
  border-radius: 999px;
  font-weight: 700;
  font-size: .93rem;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.btn:hover {
  transform: translateY(-2px);
}

.btn-primary {
  background: var(--blue);
  color: white;
  box-shadow: 0 12px 28px rgba(23,105,255,.24);
}

.btn-primary:hover { box-shadow: 0 16px 36px rgba(23,105,255,.32); }

.btn-secondary,
.btn-outline {
  border: 1px solid var(--border);
  background: white;
  color: var(--navy);
}

.btn-outline { border-color: rgba(23,105,255,.25); }

.country-line {
  margin-top: 44px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: .78rem;
  font-weight: 700;
  color: #6c7a8c;
  flex-wrap: wrap;
}

.country-line .line {
  width: 34px;
  height: 1px;
  background: #becbe0;
}

.portrait-card {
  position: relative;
  width: min(100%, 470px);
  aspect-ratio: .8;
  margin-left: auto;
  border-radius: 34px;
  padding: 14px;
  background: linear-gradient(145deg, #dceaff, #f8fbff);
  box-shadow: var(--shadow);
}


.portrait-photo-wrap {
  width: 100%;
  height: 100%;
  border-radius: 26px;
  overflow: hidden;
  background: #02060b;
  position: relative;
}

.portrait-photo-wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, transparent 64%, rgba(7, 26, 51, .16) 100%);
}

.portrait-photo {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 46%;
  transform: scale(1.015);
}

.portrait-placeholder {
  width: 100%;
  height: 100%;
  border-radius: 26px;
  display: grid;
  place-content: center;
  text-align: center;
  background:
    radial-gradient(circle at 60% 20%, rgba(63,147,255,.8), transparent 30%),
    linear-gradient(145deg, var(--navy), #123b70);
  color: white;
  overflow: hidden;
  position: relative;
}

.portrait-placeholder::after {
  content: "";
  position: absolute;
  width: 280px;
  height: 280px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  box-shadow:
    0 0 0 38px rgba(255,255,255,.04),
    0 0 0 78px rgba(255,255,255,.025);
}

.initials {
  position: relative;
  z-index: 2;
  font: 800 6.5rem/1 "Manrope", sans-serif;
  letter-spacing: -.08em;
}

.portrait-placeholder p {
  position: relative;
  z-index: 2;
  margin: 10px 0 0;
  color: rgba(255,255,255,.62);
  font-size: .8rem;
}

.floating-card {
  position: absolute;
  display: grid;
  padding: 15px 18px;
  min-width: 150px;
  border-radius: 16px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(12px);
  box-shadow: 0 14px 34px rgba(8,35,68,.13);
  border: 1px solid rgba(255,255,255,.8);
}

.floating-card strong {
  font-size: .9rem;
  color: var(--navy);
}

.floating-card span {
  font-size: .7rem;
  color: var(--muted);
}

.fc-one {
  left: -38px;
  top: 80px;
}

.fc-two {
  right: -32px;
  bottom: 76px;
}

.scroll-hint {
  position: absolute;
  bottom: 26px;
  left: 50%;
  transform: translateX(-50%);
  width: 30px;
  height: 46px;
  border: 1px solid rgba(7,26,51,.18);
  border-radius: 999px;
  display: flex;
  justify-content: center;
}

.scroll-hint span {
  width: 4px;
  height: 8px;
  border-radius: 3px;
  background: var(--blue);
  margin-top: 10px;
  animation: scrollhint 1.7s ease-in-out infinite;
}

@keyframes scrollhint {
  0%, 100% { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(12px); opacity: .3; }
}

.section {
  padding: 110px 0;
}

.section-light { background: var(--soft); }

.section-heading {
  max-width: 770px;
  margin-bottom: 56px;
}

.section-heading.centered {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

.section-heading.centered .section-label {
  justify-content: center;
}

.section-heading h2,
.family-copy h2,
.contact-inner h2 {
  margin: 14px 0 18px;
  font-family: "Manrope", sans-serif;
  font-size: clamp(2.3rem, 5vw, 4.6rem);
  line-height: 1.03;
  letter-spacing: -.05em;
  color: var(--navy);
}

.section-heading p {
  color: var(--muted);
  font-size: 1.03rem;
  margin: 0;
}

.about-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 70px;
  align-items: start;
}

.about-story {
  padding: 34px;
  background: white;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: 0 18px 55px rgba(17,50,92,.07);
}

.about-story h3 {
  margin-top: 0;
  font: 800 1.4rem/1.25 "Manrope", sans-serif;
  letter-spacing: -.025em;
}

.about-story p {
  color: #56667a;
}

.facts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.fact-card {
  min-height: 170px;
  padding: 26px;
  border-radius: var(--radius);
  background: white;
  border: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.fact-number {
  font: 800 2.8rem/1 "Manrope", sans-serif;
  letter-spacing: -.06em;
  color: var(--blue);
}

.fact-label {
  margin-top: 8px;
  color: var(--muted);
  font-size: .85rem;
}

.timeline {
  max-width: 960px;
  margin: 0 auto;
  position: relative;
}

.timeline::before {
  content: "";
  position: absolute;
  left: 160px;
  top: 12px;
  bottom: 12px;
  width: 1px;
  background: #d8e3f1;
}

.timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: 135px 30px 1fr;
  gap: 10px;
  padding: 0 0 54px;
}

.timeline-year {
  padding-top: 3px;
  text-align: right;
  color: #8490a0;
  font-size: .8rem;
  font-weight: 800;
}

.timeline-dot {
  width: 13px;
  height: 13px;
  margin: 5px auto 0;
  border-radius: 50%;
  background: white;
  border: 3px solid #9eb8dd;
  z-index: 2;
}

.timeline-dot.active {
  background: var(--blue);
  border-color: var(--blue);
  box-shadow: 0 0 0 8px rgba(23,105,255,.10);
}

.timeline-content {
  padding: 0 0 0 22px;
}

.timeline-content span {
  color: var(--blue);
  text-transform: uppercase;
  font-size: .7rem;
  letter-spacing: .12em;
  font-weight: 800;
}

.timeline-content h3 {
  margin: 6px 0 8px;
  font: 800 1.35rem/1.2 "Manrope", sans-serif;
  letter-spacing: -.025em;
}

.timeline-content p {
  margin: 0;
  color: var(--muted);
}

.section-blue {
  background:
    radial-gradient(circle at top right, rgba(77,146,255,.35), transparent 28%),
    linear-gradient(145deg, #071a33, #0a2d58);
  color: white;
}

.section-heading.light h2,
.section-heading.light p {
  color: white;
}

.section-blue .section-label { color: #7db4ff; }

.expertise-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.expertise-card {
  min-height: 290px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius);
  padding: 26px;
  background: rgba(255,255,255,.055);
  backdrop-filter: blur(8px);
  transition: transform .25s ease, background .25s ease;
}

.expertise-card:hover {
  transform: translateY(-6px);
  background: rgba(255,255,255,.085);
}

.expertise-card .icon {
  margin-bottom: auto;
  color: #7db4ff;
  font-size: .78rem;
  font-weight: 800;
}

.expertise-card h3 {
  margin: 0 0 10px;
  font: 700 1.15rem/1.25 "Manrope", sans-serif;
}

.expertise-card p {
  margin: 0;
  color: rgba(255,255,255,.66);
  font-size: .88rem;
}

.experience-list {
  border-top: 1px solid var(--border);
}

.experience-item {
  display: grid;
  grid-template-columns: 230px 1fr;
  gap: 50px;
  padding: 34px 0;
  border-bottom: 1px solid var(--border);
}

.experience-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: .8rem;
  color: var(--muted);
}

.experience-meta strong { color: var(--blue); }

.experience-main h3 {
  margin: 0 0 4px;
  font: 800 1.3rem/1.25 "Manrope", sans-serif;
}

.experience-main h4 {
  margin: 0 0 10px;
  font-size: .88rem;
  color: var(--blue);
}

.experience-main p {
  margin: 0;
  color: var(--muted);
  max-width: 730px;
}

.center-button {
  margin-top: 40px;
  text-align: center;
}

.projects-grid {
  display: grid;
  grid-template-columns: 1.25fr .875fr .875fr;
  gap: 16px;
}

.project-card {
  min-height: 360px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: white;
  box-shadow: 0 12px 40px rgba(7,26,51,.06);
  transition: transform .25s ease, box-shadow .25s ease;
}

.project-card:hover {
  transform: translateY(-7px);
  box-shadow: 0 20px 50px rgba(7,26,51,.11);
}

.project-card.featured {
  background:
    radial-gradient(circle at 78% 14%, rgba(72,145,255,.5), transparent 25%),
    linear-gradient(145deg, #071a33, #0d376a);
  color: white;
}

.project-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.project-tag {
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 800;
  color: var(--blue);
}

.featured .project-tag { color: #8abaff; }

.project-arrow {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--border);
}

.featured .project-arrow {
  border-color: rgba(255,255,255,.2);
}

.project-card h3 {
  margin: 0 0 10px;
  font: 800 1.5rem/1.2 "Manrope", sans-serif;
}

.project-card p {
  margin: 0;
  color: var(--muted);
  font-size: .9rem;
}

.featured p { color: rgba(255,255,255,.65); }

.section-family {
  background: #eef5ff;
}

.family-grid {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 80px;
  align-items: center;
}

.family-visual {
  min-height: 540px;
  padding: 14px;
  border-radius: 32px;
  background: white;
  box-shadow: var(--shadow);
}

.family-placeholder {
  min-height: 512px;
  border-radius: 24px;
  display: grid;
  place-content: center;
  text-align: center;
  padding: 50px;
  background:
    linear-gradient(rgba(7,26,51,.65), rgba(7,26,51,.8)),
    linear-gradient(145deg, #306da5, #a9d0ef);
  color: white;
}

.family-placeholder span {
  font: 800 clamp(3rem, 7vw, 6rem)/1 "Manrope", sans-serif;
  letter-spacing: -.06em;
  opacity: .9;
}

.family-placeholder p {
  max-width: 330px;
  color: rgba(255,255,255,.66);
  font-size: .82rem;
}

.family-copy p {
  color: var(--muted);
}

.family-copy blockquote {
  margin: 32px 0 0;
  padding-left: 22px;
  border-left: 3px solid var(--blue);
  font: 700 1.15rem/1.5 "Manrope", sans-serif;
  color: var(--navy);
}

.section-values {
  background: white;
}

.values-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.value-card {
  padding: 28px;
  min-height: 230px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: white;
}

.value-card > span {
  color: var(--blue);
  font-size: .72rem;
  font-weight: 800;
}

.value-card h3 {
  margin: 60px 0 8px;
  font: 800 1.25rem/1.2 "Manrope", sans-serif;
}

.value-card p {
  margin: 0;
  color: var(--muted);
  font-size: .85rem;
}

.quick-facts { background: var(--soft); }

.quick-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}

.quick-card {
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: white;
  display: grid;
  grid-template-columns: 50px 1fr;
  align-items: center;
  column-gap: 10px;
}

.quick-card > span {
  grid-row: 1 / span 2;
  font-size: 1.8rem;
}

.quick-card strong {
  font-size: .92rem;
}

.quick-card p {
  margin: 0;
  font-size: .78rem;
  color: var(--muted);
}

.contact-section {
  padding: 120px 0;
  background:
    radial-gradient(circle at 20% 0%, rgba(59,139,255,.4), transparent 25%),
    linear-gradient(145deg, #06182f, #0b3264);
  color: white;
}

.contact-inner {
  text-align: center;
  max-width: 850px;
}

.contact-inner .section-label {
  color: #85b9ff;
}

.contact-inner .section-label::before {
  display: none;
}

.contact-inner h2 {
  color: white;
  font-size: clamp(3.4rem, 8vw, 7rem);
}

.contact-inner p {
  color: rgba(255,255,255,.65);
  max-width: 600px;
  margin: 0 auto 32px;
}

.contact-actions { justify-content: center; }

.btn-white {
  background: white;
  color: var(--navy);
}

.btn-glass {
  background: rgba(255,255,255,.08);
  color: white;
  border: 1px solid rgba(255,255,255,.16);
}

.contact-location {
  margin-top: 42px;
  color: rgba(255,255,255,.42);
  font-size: .8rem;
}

.site-footer {
  padding: 40px 0;
  background: #041121;
  color: white;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 50px;
  align-items: center;
}

.footer-brand { color: white; }

.footer-grid p {
  margin: 5px 0 0;
  font-size: .75rem;
  color: rgba(255,255,255,.42);
}

.footer-links {
  display: flex;
  gap: 20px;
  font-size: .78rem;
  color: rgba(255,255,255,.58);
}

.footer-copy {
  font-size: .74rem;
  color: rgba(255,255,255,.42);
}

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .7s ease, transform .7s ease;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.delay-1 { transition-delay: .08s; }
.delay-2 { transition-delay: .16s; }
.delay-3 { transition-delay: .24s; }

@media (max-width: 980px) {
  .nav { display: none; }
  .nav-toggle { display: block; }
  .language-switcher { margin-left: 0; }

  .nav.open {
    position: absolute;
    left: 20px;
    right: 20px;
    top: 70px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 20px;
    background: white;
    border: 1px solid var(--border);
    border-radius: 18px;
    box-shadow: var(--shadow);
  }

  .hero-grid,
  .about-grid,
  .family-grid {
    grid-template-columns: 1fr;
  }

  .hero-visual { margin-top: 20px; }

  .portrait-card { margin: 0 auto; }

  .expertise-grid,
  .values-grid {
    grid-template-columns: 1fr 1fr;
  }

  .projects-grid {
    grid-template-columns: 1fr;
  }

  .project-card { min-height: 280px; }

  .footer-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .footer-links {
    flex-wrap: wrap;
  }
}

@media (max-width: 680px) {
  .container {
    width: min(100% - 28px, 1180px);
  }

  .site-header .container {
    width: min(100% - 24px, 1180px);
  }

  .language-switcher { display: none; }

  .hero {
    min-height: auto;
    padding-top: 120px;
  }

  .hero h1 {
    font-size: clamp(3.4rem, 19vw, 5.5rem);
  }

  .hero-kicker { font-size: 1.05rem; }

  .country-line .line { width: 18px; }

  .portrait-card {
    width: 90%;
  }

  .floating-card {
    min-width: 125px;
    padding: 11px 13px;
  }

  .fc-one { left: -20px; }
  .fc-two { right: -20px; }

  .section {
    padding: 82px 0;
  }

  .facts-grid,
  .expertise-grid,
  .values-grid,
  .quick-grid {
    grid-template-columns: 1fr;
  }

  .timeline::before { left: 14px; }

  .timeline-item {
    grid-template-columns: 30px 1fr;
    padding-bottom: 42px;
  }

  .timeline-year {
    grid-column: 2;
    grid-row: 1;
    text-align: left;
    padding: 0 0 3px 16px;
  }

  .timeline-dot {
    grid-column: 1;
    grid-row: 1 / span 2;
    margin-top: 4px;
  }

  .timeline-content {
    grid-column: 2;
    padding-left: 16px;
  }

  .experience-item {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .family-visual { min-height: 390px; }
  .family-placeholder { min-height: 360px; }

  .footer-links { gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


/* Kada dodaš images/family.jpg, možeš zameniti family-placeholder HTML sa:
   <img src="images/family.jpg" alt="Familie" class="family-photo">
*/
.family-photo {
  width: 100%;
  min-height: 512px;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 24px;
}


.family-image-wrap {
  width: 100%;
  height: 100%;
  min-height: 512px;
  border-radius: 24px;
  overflow: hidden;
  background: #dbe8f8;
}

.family-image-wrap .family-photo {
  width: 100%;
  height: 100%;
  min-height: 512px;
  display: block;
  object-fit: cover;
  object-position: center 42%;
}

.contact-direct {
  margin-top: 18px;
  font-size: .88rem;
}

.contact-direct a {
  color: rgba(255,255,255,.78);
  border-bottom: 1px solid rgba(255,255,255,.22);
  padding-bottom: 2px;
}

@media (max-width: 680px) {
  .family-image-wrap,
  .family-image-wrap .family-photo {
    min-height: 360px;
  }
}


/* Final family image settings */

.family-image-wrap {
  width: 100%;
  height: 100%;
  min-height: 540px;
  border-radius: 24px;
  overflow: hidden;
  background: #dbe8f8;
}

.family-image-wrap .family-photo {
  width: 100%;
  height: 100%;
  min-height: 540px;
  display: block;
  object-fit: cover;
  object-position: center 38%;
}

@media (max-width: 680px) {
  .family-image-wrap,
  .family-image-wrap .family-photo {
    min-height: 390px;
  }

  .family-image-wrap .family-photo {
    object-position: center 34%;
  }
}


/* ---------- Language / legal / CV pages ---------- */
.page-hero {
  padding: 145px 0 70px;
  background:
    radial-gradient(circle at 85% 15%, rgba(23,105,255,.12), transparent 28%),
    linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
  border-bottom: 1px solid var(--border);
}

.page-hero h1 {
  margin: 12px 0 14px;
  font-family: "Manrope", sans-serif;
  font-size: clamp(2.8rem, 7vw, 5.7rem);
  line-height: .95;
  letter-spacing: -.055em;
  color: var(--navy);
}

.page-hero p {
  max-width: 760px;
  color: var(--muted);
  font-size: 1.03rem;
}

.lang-links {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.lang-links a {
  padding: 7px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 800;
  color: var(--muted);
}

.lang-links a.active {
  background: var(--navy);
  color: white;
  border-color: var(--navy);
}

.cv-layout {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 44px;
  align-items: start;
}

.cv-sidebar {
  position: sticky;
  top: 104px;
  padding: 26px;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--soft);
}

.cv-sidebar h3 {
  margin: 0 0 18px;
  font: 800 1.1rem/1.2 "Manrope", sans-serif;
}

.cv-sidebar dl {
  margin: 0;
}

.cv-sidebar dt {
  margin-top: 14px;
  font-size: .7rem;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 800;
  color: var(--blue);
}

.cv-sidebar dd {
  margin: 4px 0 0;
  color: var(--text);
  font-size: .9rem;
}

.cv-main h2 {
  margin: 0 0 18px;
  font: 800 2rem/1.1 "Manrope", sans-serif;
  letter-spacing: -.035em;
  color: var(--navy);
}

.cv-section {
  margin-bottom: 54px;
}

.cv-entry {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 26px;
  padding: 24px 0;
  border-top: 1px solid var(--border);
}

.cv-entry:last-child {
  border-bottom: 1px solid var(--border);
}

.cv-date {
  color: var(--blue);
  font-size: .8rem;
  font-weight: 800;
}

.cv-entry h3 {
  margin: 0 0 3px;
  font: 800 1.15rem/1.25 "Manrope", sans-serif;
}

.cv-entry h4 {
  margin: 0 0 9px;
  color: var(--blue);
  font-size: .88rem;
}

.cv-entry p {
  margin: 0;
  color: var(--muted);
}

.skill-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.skill-cloud span {
  padding: 9px 12px;
  border-radius: 999px;
  background: var(--sky);
  border: 1px solid rgba(23,105,255,.12);
  color: var(--navy);
  font-size: .82rem;
  font-weight: 700;
}

.legal-content {
  max-width: 860px;
}

.legal-content h2 {
  margin: 42px 0 10px;
  font: 800 1.5rem/1.2 "Manrope", sans-serif;
  color: var(--navy);
}

.legal-content h3 {
  margin: 28px 0 8px;
  font: 800 1.08rem/1.3 "Manrope", sans-serif;
  color: var(--navy);
}

.legal-content p,
.legal-content li {
  color: var(--muted);
}

.legal-note {
  padding: 18px 20px;
  border-radius: 16px;
  background: #fff8e6;
  border: 1px solid rgba(199,145,0,.18);
  color: #6d5700;
  font-size: .88rem;
}

.footer-legal {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

@media (max-width: 850px) {
  .cv-layout {
    grid-template-columns: 1fr;
  }

  .cv-sidebar {
    position: static;
  }
}

@media (max-width: 680px) {
  .cv-entry {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}


/* FIX v8: language switcher uses <a> links on DE / EN / SR pages */
.language-switcher a {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  text-decoration: none;
  font-size: .72rem;
  font-weight: 800;
  line-height: 1;
  transition: .2s ease;
}

.language-switcher a:hover {
  border-color: rgba(23, 105, 255, .35);
  color: var(--navy);
  background: var(--soft);
}

.language-switcher a.active {
  background: var(--navy);
  color: #fff;
  border-color: var(--navy);
}

.language-switcher {
  display: flex;
  align-items: center;
  gap: 7px;
}


/* v9: four-language switcher */
.language-switcher a,
.lang-links a {
  min-width: 38px;
  height: 38px;
  padding: 0 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  text-decoration: none;
  font-size: .72rem;
  font-weight: 800;
  line-height: 1;
}
.language-switcher a.active,
.lang-links a.active {
  background: var(--navy);
  color: #fff;
  border-color: var(--navy);
}

/* v12 multilingual consistency */
.project-card h3 a { color: inherit; text-decoration: none; }
.project-card h3 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.language-switcher { flex-shrink: 0; }


/* v14 — Education & Certifications */
.education-preview{background:#fff}
.education-preview-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:36px}
.edu-preview-card{border:1px solid #dbe3ef;border-radius:24px;padding:26px;min-height:210px;background:#fff;display:flex;flex-direction:column;justify-content:space-between;transition:.25s ease}
.edu-preview-card:hover{transform:translateY(-4px);box-shadow:0 18px 45px rgba(13,44,82,.09)}
.edu-preview-card span,.cert-card .cert-year{font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#1261ff}
.edu-preview-card h3{font-size:1.25rem;margin:34px 0 8px;color:#071d3b}
.edu-preview-card p{color:#60708a;margin:0;line-height:1.55}
.education-hero{padding:145px 0 65px;background:linear-gradient(180deg,#f6f9fe 0%,#fff 100%)}
.education-hero h1{font-family:Manrope,sans-serif;font-size:clamp(3rem,7vw,6.3rem);line-height:.95;letter-spacing:-.06em;color:#061b38;margin:14px 0 24px}
.education-hero p{max-width:850px;font-size:1.12rem;line-height:1.7;color:#61708a}
.cert-section{padding:70px 0}
.cert-section.alt{background:#f5f8fc}
.cert-section h2{font-family:Manrope,sans-serif;font-size:clamp(2rem,4vw,3.6rem);letter-spacing:-.045em;color:#061b38;margin:8px 0 30px}
.cert-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cert-card{border:1px solid #dbe3ef;border-radius:22px;padding:25px;background:#fff;min-height:190px}
.cert-card.featured{background:#0b315f;color:#fff;border-color:#0b315f}
.cert-card.featured h3,.cert-card.featured p{color:#fff}
.cert-card h3{font-size:1.18rem;line-height:1.3;color:#071d3b;margin:20px 0 8px}
.cert-card p{color:#64748b;line-height:1.55;margin:0}
.cert-card small{display:block;margin-top:14px;color:#7b8aa0}
.cert-card.featured small{color:#c8d7eb}
.cert-note{margin-top:25px;padding:18px 22px;border-radius:16px;background:#eef4ff;color:#42536d;line-height:1.6}
.cv-education{margin-top:55px;padding-top:38px;border-top:1px solid #d7dfeb}
.cv-education h2{font-size:1.7rem;margin-bottom:22px}
.cv-edu-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 26px}
.cv-edu-item{padding:14px 0;border-bottom:1px solid #e1e7f0}
.cv-edu-item strong{display:block;color:#071d3b;margin-bottom:4px}
.cv-edu-item span{font-size:.92rem;color:#61708a}
@media(max-width:900px){.education-preview-grid,.cert-grid{grid-template-columns:1fr 1fr}.cv-edu-grid{grid-template-columns:1fr}}
@media(max-width:600px){.education-preview-grid,.cert-grid{grid-template-columns:1fr}.education-hero{padding-top:115px}}


/* v15 — Featured certifications & expandable details */
.featured-certs{padding:78px 0;background:#071a33;color:#fff}
.featured-certs .section-label{color:#7fb2ff}
.featured-certs h2{font-family:Manrope,sans-serif;font-size:clamp(2.4rem,5vw,4.6rem);letter-spacing:-.05em;margin:12px 0 12px;color:#fff}
.featured-certs .lead{max-width:820px;color:#b8c7db;margin:0 0 34px}
.featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.featured-cert{background:linear-gradient(145deg,#0b2f5d,#0c3c79);border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:24px;min-height:260px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 24px 55px rgba(0,0,0,.16)}
.featured-cert h3{font-size:1.28rem;line-height:1.3;margin:18px 0 8px;color:#fff}
.featured-cert p{margin:0;color:#c7d5e7;line-height:1.55}
.featured-cert .cert-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
.cert-pill{font-size:.72rem;font-weight:800;border-radius:999px;padding:7px 10px;background:rgba(255,255,255,.09);color:#dce8f7;border:1px solid rgba(255,255,255,.1)}
.brand-mark{display:inline-flex;align-items:center;justify-content:center;height:38px;min-width:78px;padding:0 12px;border-radius:10px;background:#fff;color:#071a33;font-weight:900;letter-spacing:.04em;font-size:.82rem}
.brand-mark.google{font-weight:800;letter-spacing:0}
.brand-mark.ibm{letter-spacing:.12em}
.brand-mark.lsba{font-size:.75rem}
.brand-mark.eilm{font-size:.75rem}
.brand-mark.umich{font-size:.72rem}
.brand-mark.vanderbilt{font-size:.68rem}
.brand-mark.googlecloud{font-size:.68rem}

.cert-details{margin-top:14px;border-top:1px solid #e2e8f0}
.cert-details details{border-bottom:1px solid #e2e8f0}
.cert-details summary{cursor:pointer;list-style:none;padding:18px 0;font-weight:800;color:#0a2342;display:flex;align-items:center;justify-content:space-between;gap:16px}
.cert-details summary::-webkit-details-marker{display:none}
.cert-details summary::after{content:"+";font-size:1.3rem;color:#1261ff}
.cert-details details[open] summary::after{content:"–"}
.cert-detail-body{padding:0 0 20px;color:#64748b;line-height:1.65}
.cert-detail-body ul{margin:10px 0 0 18px;padding:0}
.cert-detail-body li{margin:5px 0}
.cert-card .brand-mark{margin-bottom:6px}
.cert-card .detail-link{display:inline-flex;margin-top:14px;font-size:.78rem;font-weight:800;color:#1261ff}

@media(max-width:950px){.featured-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.featured-grid{grid-template-columns:1fr}}


/* v16 — CV education alignment */
.cv-education-wrap{
  width:min(1180px, calc(100% - 48px));
  margin:0 auto;
}
.cv-education{
  margin-top:0;
  padding:54px 0 70px;
  border-top:1px solid #d7dfeb;
}
.cv-education h2{
  font-family:Manrope,sans-serif;
  font-size:clamp(1.8rem,3vw,2.5rem);
  letter-spacing:-.035em;
  margin:0 0 26px;
  color:#071d3b;
}
.cv-edu-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 34px;
}
.cv-edu-item{
  padding:18px 0;
  border-bottom:1px solid #e1e7f0;
}
.cv-edu-item strong{
  display:block;
  color:#071d3b;
  margin-bottom:6px;
  line-height:1.35;
}
.cv-edu-item span{
  display:block;
  font-size:.94rem;
  color:#61708a;
  line-height:1.45;
}

.project-founder{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0 0 12px;
  padding:7px 10px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.12);
  color:#cfe1f8;
}
.project-card.featured .project-founder{
  color:#d9e8fa;
}
.project-card.featured h3 a{
  color:#fff;
}
.project-card.featured h3 a:hover{
  text-decoration:underline;
  text-underline-offset:4px;
}

@media(max-width:900px){
  .cv-edu-grid{grid-template-columns:1fr}
  .cv-education-wrap{width:min(100% - 32px,1180px)}
}

/* v17 — clickable featured certificate PDFs */
.featured-cert-link{color:inherit;text-decoration:none}
.featured-cert-link:hover{text-decoration:underline;text-underline-offset:5px}
.featured-cert:has(.featured-cert-link){position:relative}
.featured-cert:has(.featured-cert-link)::after{
 content:"↗";position:absolute;right:22px;top:22px;width:34px;height:34px;
 border:1px solid rgba(255,255,255,.18);border-radius:50%;
 display:flex;align-items:center;justify-content:center;color:#dbe9fb;font-weight:800
}

/* v18 — certificate document links + six-language switch */
.cert-file-link{color:inherit;text-decoration:none}
.cert-file-link:hover{text-decoration:underline;text-underline-offset:4px}
.featured-cert .cert-file-link{color:#fff}
.cv-edu-item .cert-file-link{color:#071d3b}
@media(max-width:1120px){
  .language-switcher{gap:4px}
  .language-switcher a,.lang-links a{min-width:34px;height:34px;padding:0 7px;font-size:.68rem}
}


/* =========================================================
   v21 BLOG
   ========================================================= */
.blog-home-preview{background:#fff}
.blog-preview-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:22px;margin-top:34px}
.blog-preview-card{border:1px solid #dbe3ef;border-radius:26px;background:#fff;padding:30px;min-height:300px;display:flex;flex-direction:column;justify-content:space-between}
.blog-preview-card.featured{background:linear-gradient(145deg,#09264b,#0c437f);border-color:#0c437f;color:#fff}
.blog-preview-card.featured h3,.blog-preview-card.featured p,.blog-preview-card.featured .blog-date{color:#fff}
.blog-meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.blog-date{color:#697a91;font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.blog-category{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:999px;background:#eef4ff;color:#1261ff;font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.blog-preview-card.featured .blog-category{background:rgba(255,255,255,.1);color:#dceaff;border:1px solid rgba(255,255,255,.12)}
.blog-preview-card h3{font-family:Manrope,sans-serif;font-size:clamp(1.55rem,3vw,2.45rem);line-height:1.08;letter-spacing:-.035em;color:#071d3b;margin:28px 0 12px}
.blog-preview-card p{color:#61708a;line-height:1.7;margin:0}
.blog-read{display:inline-flex;margin-top:26px;color:#1261ff;font-weight:800;text-decoration:none}
.blog-preview-card.featured .blog-read{color:#fff}
.blog-read:hover{text-decoration:underline;text-underline-offset:4px}

.blog-hero{padding:160px 0 88px;background:radial-gradient(circle at 85% 15%,rgba(31,105,255,.11),transparent 30%),linear-gradient(180deg,#f5f8fd 0%,#fff 100%)}
.blog-hero h1{max-width:920px;margin:16px 0 24px;font-family:Manrope,sans-serif;font-size:clamp(3.3rem,7vw,6.4rem);line-height:.96;letter-spacing:-.065em;color:#071c39}
.blog-hero p{max-width:800px;color:#61708a;font-size:1.12rem;line-height:1.75}
.blog-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin:0 0 36px}
.blog-filters{display:flex;gap:8px;flex-wrap:wrap}
.blog-filter{appearance:none;border:1px solid #d7dfeb;background:#fff;color:#52627a;border-radius:999px;padding:10px 16px;font:inherit;font-size:.82rem;font-weight:800;cursor:pointer}
.blog-filter.active,.blog-filter:hover{background:#081f3e;border-color:#081f3e;color:#fff}
.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.blog-card{min-height:330px;border:1px solid #dbe3ef;border-radius:26px;background:#fff;padding:30px;display:flex;flex-direction:column;justify-content:space-between}
.blog-card.featured{grid-column:span 2;background:linear-gradient(145deg,#09264b,#0c437f);border-color:#0c437f;color:#fff}
.blog-card.featured h2,.blog-card.featured p,.blog-card.featured .blog-date{color:#fff}
.blog-card h2{font-family:Manrope,sans-serif;font-size:clamp(1.55rem,3vw,2.35rem);line-height:1.08;letter-spacing:-.035em;margin:30px 0 14px;color:#071d3b}
.blog-card p{color:#61708a;line-height:1.7}
.blog-card.featured .blog-read{color:#fff}

.article-hero{padding:140px 0 60px;background:radial-gradient(circle at 78% 40%,#0b5bba 0,#073c79 16%,#061d3b 42%,#031326 75%);color:#fff}
.article-hero .container,.article-body .container{width:min(900px,calc(100% - 48px))}
.article-hero h1{font-family:Manrope,sans-serif;font-size:clamp(3rem,7vw,5.8rem);line-height:.98;letter-spacing:-.06em;margin:22px 0;color:#fff}
.article-hero p{color:#e3edf9;font-size:1.16rem;line-height:1.7}
.article-body{padding:55px 0 100px}
.article-body article{font-size:1.06rem;line-height:1.85;color:#273850}
.article-body h2{font-family:Manrope,sans-serif;font-size:2rem;color:#071c39;margin:52px 0 16px}
.article-body h3{font-size:1.28rem;color:#071c39;margin:36px 0 12px}
.article-body p{margin:0 0 23px}
.article-body blockquote{margin:40px 0;padding:24px 28px;border-left:3px solid #1261ff;background:#f3f7fd;border-radius:0 16px 16px 0;color:#183657;font-size:1.18rem;font-weight:600}
.article-feature-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:38px 0;border-top:1px solid #dce4ef;border-bottom:1px solid #dce4ef}
.article-feature{padding:24px 20px;border-right:1px solid #dce4ef}
.article-feature:last-child{border-right:0}
.article-feature strong{display:block;margin-bottom:8px}
.article-feature p{font-size:.92rem;line-height:1.55;margin:0}
.article-callout{padding:26px;border-radius:18px;background:linear-gradient(90deg,#edf3ff,#f8fbff);margin:40px 0}
.article-checks{display:grid;gap:14px;margin:24px 0}
.article-check{padding:16px 18px;border:1px solid #dbe3ef;border-radius:14px;background:#fff}
.article-nav{display:flex;justify-content:space-between;gap:20px;margin-top:50px;padding-top:30px;border-top:1px solid #dce4ef}
.article-nav a{color:#1261ff;font-weight:800;text-decoration:none}
.article-nav a:hover{text-decoration:underline;text-underline-offset:4px}
.blog-empty{display:none;grid-column:1/-1;padding:50px;border:1px dashed #cfd8e6;border-radius:24px;color:#718096;text-align:center}

@media(max-width:900px){
  .blog-preview-grid,.blog-grid{grid-template-columns:1fr}
  .blog-card.featured{grid-column:span 1}
  .article-feature-grid{grid-template-columns:1fr 1fr}
  .article-feature{border-bottom:1px solid #dce4ef}
}
@media(max-width:620px){
  .article-feature-grid{grid-template-columns:1fr}
  .article-feature{border-right:0}
}


/* =========================================================
   v22 — visual blog article layout
   ========================================================= */

.article-hero.visual-hero{
  padding:0;
  background:#031326;
}
.article-hero-grid{
  width:min(1180px,calc(100% - 48px));
  min-height:470px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:34px;
  align-items:center;
}
.article-hero-copy{
  padding:82px 0 70px;
}
.article-hero-copy .blog-meta{
  margin-bottom:16px;
}
.article-hero.visual-hero h1{
  font-family:Manrope,sans-serif;
  font-size:clamp(3rem,6vw,5.5rem);
  line-height:.98;
  letter-spacing:-.06em;
  margin:18px 0 24px;
  color:#fff;
}
.article-hero.visual-hero p{
  color:#dce8f7;
  font-size:1.12rem;
  line-height:1.72;
  max-width:650px;
}
.article-hero-image{
  align-self:stretch;
  overflow:hidden;
  min-height:470px;
  position:relative;
}
.article-hero-image:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#031326 0%,rgba(3,19,38,.55) 13%,rgba(3,19,38,0) 42%);
  pointer-events:none;
}
.article-hero-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.article-body.visual-article{
  padding:60px 0 100px;
}
.article-body.visual-article .container{
  width:min(1100px,calc(100% - 48px));
}
.article-row{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:48px;
  align-items:center;
  margin-bottom:48px;
}
.article-row.reverse{
  grid-template-columns:.82fr 1.18fr;
}
.article-text h2{
  margin-top:0;
}
.article-image-card{
  overflow:hidden;
  border-radius:20px;
  box-shadow:0 22px 60px rgba(7,40,78,.13);
  background:#0a315e;
}
.article-image-card img{
  width:100%;
  height:100%;
  min-height:270px;
  object-fit:cover;
  display:block;
}

.article-feature-grid.visual-features{
  grid-template-columns:repeat(5,minmax(0,1fr));
  margin:45px 0;
}
.article-feature-icon{
  width:42px;
  height:42px;
  margin-bottom:16px;
  border:1px solid #b9d3ff;
  border-radius:12px;
  display:grid;
  place-items:center;
  color:#1261ff;
  font-size:1.25rem;
  font-weight:900;
}

.article-quote{
  margin:42px 0;
  padding:28px 30px;
  border-radius:18px;
  background:linear-gradient(90deg,#eaf2ff,#f6f9ff);
  color:#183657;
  font-size:1.18rem;
  line-height:1.55;
  display:flex;
  gap:30px;
  justify-content:space-between;
  align-items:flex-end;
}
.article-quote strong{
  color:#1261ff;
  white-space:nowrap;
  font-size:.9rem;
}

.article-example-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:48px;
  align-items:center;
  margin:28px 0 55px;
}
.article-checks.visual-checks{
  margin:0;
}
.article-check.visual-check{
  padding:0;
  border:0;
  border-radius:0;
  display:grid;
  grid-template-columns:24px 1fr;
  gap:10px;
}
.article-check.visual-check .check-icon{
  color:#1261ff;
  font-weight:900;
}
.article-check.visual-check p{
  margin:4px 0 0;
}

.article-conclusion{
  display:grid;
  grid-template-columns:1.35fr .65fr;
  gap:45px;
  align-items:center;
  margin-top:38px;
}
.article-conclusion .article-image-card img{
  min-height:190px;
}

@media(max-width:900px){
  .article-hero-grid,
  .article-row,
  .article-row.reverse,
  .article-example-grid,
  .article-conclusion{
    grid-template-columns:1fr;
  }
  .article-hero-image{
    min-height:300px;
  }
  .article-hero-image:after{
    background:linear-gradient(180deg,#031326 0%,rgba(3,19,38,.25) 18%,rgba(3,19,38,0) 48%);
  }
  .article-feature-grid.visual-features{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:600px){
  .article-feature-grid.visual-features{
    grid-template-columns:1fr;
  }
  .article-quote{
    flex-direction:column;
    align-items:flex-start;
  }
}


/* v23 homepage blog thumbnail */
.blog-preview-card.featured{overflow:hidden;position:relative}
.blog-preview-thumb{margin:-30px -30px 24px;height:210px;overflow:hidden}
.blog-preview-thumb img{width:100%;height:100%;object-fit:cover;display:block}


/* =========================================================
   v26 — responsive CSS AI hero + visual blog landing hero
   ========================================================= */

/* Article hero: no raster image, scalable CSS artwork */
.article-hero-image.ai-orbit-visual{
  min-height:470px;
  display:grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 70% 48%, rgba(37,129,255,.18), transparent 34%),
    linear-gradient(135deg,#071f43 0%,#0a4aa2 55%,#0d66d6 100%);
}
.article-hero-image.ai-orbit-visual:before,
.article-hero-image.ai-orbit-visual:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(158,207,255,.38);
  pointer-events:none;
}
.article-hero-image.ai-orbit-visual:before{
  width:min(72%,420px);
  aspect-ratio:1;
  box-shadow:
    0 0 0 52px rgba(104,181,255,.07),
    0 0 0 104px rgba(104,181,255,.055),
    0 0 0 156px rgba(104,181,255,.04);
}
.article-hero-image.ai-orbit-visual:after{
  width:min(48%,280px);
  aspect-ratio:1;
  border-color:rgba(170,218,255,.48);
}
.ai-orbit-core{
  width:clamp(120px,15vw,170px);
  aspect-ratio:1;
  border-radius:50%;
  display:grid;
  place-items:center;
  position:relative;
  z-index:2;
  font-family:Manrope,sans-serif;
  font-size:clamp(2.7rem,5vw,4.7rem);
  font-weight:800;
  letter-spacing:-.04em;
  color:#fff;
  background:radial-gradient(circle at 36% 30%,#1779ee,#0955bd 58%,#063e8f);
  box-shadow:
    0 0 50px rgba(0,111,255,.55),
    inset 0 0 36px rgba(255,255,255,.08);
}
.ai-orbit-ring{
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(162,210,255,.36);
  pointer-events:none;
}
.ai-orbit-ring.r1{width:min(58%,340px);aspect-ratio:1}
.ai-orbit-ring.r2{width:min(78%,455px);aspect-ratio:1}
.ai-orbit-ring.r3{width:min(98%,570px);aspect-ratio:1;border-color:rgba(162,210,255,.22)}
.ai-orbit-gridline{
  position:absolute;
  width:120%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(174,214,255,.24),transparent);
}
.ai-orbit-gridline.g1{transform:rotate(20deg)}
.ai-orbit-gridline.g2{transform:rotate(-28deg)}
.ai-orbit-gridline.g3{transform:rotate(63deg)}

/* Blog landing intro: colored instead of white */
.blog-hero.visual-blog-landing{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 28%,rgba(62,150,255,.28),transparent 28%),
    radial-gradient(circle at 16% 82%,rgba(13,104,219,.18),transparent 35%),
    linear-gradient(135deg,#061a36 0%,#0a3568 48%,#0b55a7 100%);
  color:#fff;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.blog-hero.visual-blog-landing:before,
.blog-hero.visual-blog-landing:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(170,215,255,.17);
  pointer-events:none;
}
.blog-hero.visual-blog-landing:before{
  width:520px;
  height:520px;
  right:-120px;
  top:-145px;
  box-shadow:
    0 0 0 72px rgba(105,181,255,.035),
    0 0 0 144px rgba(105,181,255,.025);
}
.blog-hero.visual-blog-landing:after{
  width:300px;
  height:300px;
  left:-110px;
  bottom:-160px;
}
.blog-hero.visual-blog-landing .container{
  position:relative;
  z-index:2;
}
.blog-hero.visual-blog-landing .section-label{
  color:#71b2ff;
}
.blog-hero.visual-blog-landing h1{
  color:#fff;
  max-width:920px;
}
.blog-hero.visual-blog-landing p{
  color:#c9d8eb;
}
.blog-hero-lines{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.22;
  background:
    linear-gradient(115deg,transparent 0 57%,rgba(255,255,255,.09) 57% 57.15%,transparent 57.15%),
    linear-gradient(25deg,transparent 0 72%,rgba(255,255,255,.07) 72% 72.12%,transparent 72.12%);
}

/* Give blog preview on main homepage a subtle visual tint too */
.blog-home-preview{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 92% 10%,rgba(18,97,255,.09),transparent 28%),
    linear-gradient(180deg,#f7faff 0%,#fff 100%);
}
.blog-home-preview:after{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  border-radius:50%;
  border:1px solid rgba(18,97,255,.08);
  right:-170px;
  top:-170px;
  box-shadow:0 0 0 64px rgba(18,97,255,.025),0 0 0 128px rgba(18,97,255,.018);
  pointer-events:none;
}
.blog-home-preview .container{position:relative;z-index:2}

@media(max-width:900px){
  .article-hero-image.ai-orbit-visual{min-height:320px}
  .article-hero-image.ai-orbit-visual:before{width:min(68%,300px)}
  .ai-orbit-ring.r3{width:min(92%,420px)}
}

/* v27 — AI orbit fills the complete right hero panel */
.article-hero-image.ai-orbit-visual{place-items:stretch;isolation:isolate}
.article-hero-image.ai-orbit-visual:before{width:125%;aspect-ratio:1;right:-34%;top:-28%;left:auto;transform:none;box-shadow:0 0 0 90px rgba(104,181,255,.055),0 0 0 180px rgba(104,181,255,.038),0 0 0 270px rgba(104,181,255,.024)}
.article-hero-image.ai-orbit-visual:after{width:82%;aspect-ratio:1;right:-5%;top:8%;left:auto;transform:none}
.article-hero-image.ai-orbit-visual .ai-orbit-ring{left:auto;top:auto}
.article-hero-image.ai-orbit-visual .ai-orbit-ring.r1{width:72%;aspect-ratio:1;right:2%;top:14%}
.article-hero-image.ai-orbit-visual .ai-orbit-ring.r2{width:108%;aspect-ratio:1;right:-20%;top:-5%}
.article-hero-image.ai-orbit-visual .ai-orbit-ring.r3{width:148%;aspect-ratio:1;right:-46%;top:-30%}
.article-hero-image.ai-orbit-visual .ai-orbit-core{position:absolute;width:clamp(118px,14vw,165px);right:24%;top:50%;transform:translateY(-50%)}
.article-hero-image.ai-orbit-visual .ai-orbit-gridline{width:160%;left:-25%;top:50%}
@media(max-width:900px){.article-hero-image.ai-orbit-visual .ai-orbit-core{right:50%;transform:translate(50%,-50%)}.article-hero-image.ai-orbit-visual:before{width:115%;right:-20%}.article-hero-image.ai-orbit-visual .ai-orbit-ring.r3{width:135%;right:-30%}}


/* =========================================================
   v28 — Blog article final footer
   ========================================================= */

.blog-article-footer{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 88% 14%,rgba(30,113,234,.18),transparent 25%),
    linear-gradient(135deg,#061a35 0%,#071f40 55%,#082954 100%);
  color:#fff;
  border-top:1px solid rgba(255,255,255,.08);
}
.blog-article-footer:before,
.blog-article-footer:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(109,178,255,.13);
  pointer-events:none;
}
.blog-article-footer:before{
  width:470px;
  height:470px;
  right:-210px;
  bottom:-250px;
  box-shadow:
    0 0 0 62px rgba(71,151,255,.025),
    0 0 0 124px rgba(71,151,255,.017);
}
.blog-article-footer:after{
  width:210px;
  height:210px;
  right:80px;
  bottom:-140px;
}
.blog-footer-main{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  display:grid;
  grid-template-columns:1.25fr .9fr .95fr 1fr;
  gap:56px;
  padding:48px 0 34px;
  position:relative;
  z-index:2;
}
.blog-footer-brand .brand{
  color:#fff;
  display:inline-flex;
  margin-bottom:16px;
}
.blog-footer-brand p{
  color:#b8c8db;
  max-width:265px;
  line-height:1.65;
  margin:0 0 22px;
  font-size:.92rem;
}
.blog-footer-social{
  display:flex;
  gap:10px;
}
.blog-footer-social a{
  width:34px;
  height:34px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#dce9f7;
  text-decoration:none;
  font-size:.8rem;
  font-weight:800;
  transition:.2s ease;
}
.blog-footer-social a:hover{
  background:#fff;
  color:#082954;
}
.blog-footer-col h4{
  margin:2px 0 16px;
  color:#7fb7ff;
  font-size:.76rem;
  text-transform:uppercase;
  letter-spacing:.09em;
}
.blog-footer-col nav,
.blog-footer-col .blog-footer-list{
  display:grid;
  gap:8px;
}
.blog-footer-col a,
.blog-footer-col span{
  color:#d8e4f2;
  text-decoration:none;
  font-size:.9rem;
  line-height:1.4;
}
.blog-footer-col a:hover{
  color:#fff;
  text-decoration:underline;
  text-underline-offset:3px;
}
.blog-footer-contact{
  display:grid;
  gap:11px;
}
.blog-footer-contact a,
.blog-footer-contact span{
  display:flex;
  align-items:center;
  gap:9px;
}
.blog-footer-contact .ico{
  width:20px;
  text-align:center;
  color:#7fb7ff;
}
.blog-footer-bottom{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  padding:18px 0 23px;
  border-top:1px solid rgba(255,255,255,.11);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  color:#9fb0c5;
  font-size:.82rem;
  position:relative;
  z-index:2;
}
.blog-footer-legal{
  display:flex;
  align-items:center;
  gap:14px;
}
.blog-footer-legal a{
  color:#cdd9e8;
  text-decoration:none;
}
.blog-footer-legal a:hover{
  color:#fff;
}
.blog-footer-sep{
  color:rgba(255,255,255,.32);
}

@media(max-width:980px){
  .blog-footer-main{
    grid-template-columns:1fr 1fr;
    gap:38px;
  }
}
@media(max-width:620px){
  .blog-footer-main{
    grid-template-columns:1fr;
    gap:30px;
    padding-top:38px;
  }
  .blog-footer-bottom{
    flex-direction:column;
    align-items:flex-start;
  }
}


/* =========================================================
   v29 — TRUE FULL-WIDTH BLOG ARTICLE HERO
   Fix: the old .article-hero-grid was centered at max 1180px,
   which left dark background visible to the right.
   ========================================================= */

.article-hero.visual-hero{
  width:100%;
  overflow:hidden;
}

/* Full viewport width — no centered max-width container */
.article-hero.visual-hero .article-hero-grid{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  min-height:470px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(480px,.92fr);
  gap:0 !important;
  align-items:stretch;
}

/* Keep the LEFT text aligned to the site's normal content grid */
.article-hero.visual-hero .article-hero-copy{
  padding:
    74px
    clamp(36px,5vw,78px)
    68px
    max(32px,calc((100vw - 1180px)/2));
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:
    radial-gradient(circle at 100% 50%,rgba(16,75,145,.18),transparent 34%),
    #031326;
}

/* The RIGHT panel now reaches the browser edge */
.article-hero.visual-hero .article-hero-image.ai-orbit-visual{
  width:100% !important;
  min-width:0;
  height:100%;
  min-height:470px;
  margin:0 !important;
  border-radius:0 !important;
  background:
    radial-gradient(circle at 64% 48%,rgba(44,143,255,.27),transparent 28%),
    linear-gradient(135deg,#082b5a 0%,#0a4da5 48%,#1268d8 100%);
}

/* Spread the geometry across the whole right panel instead of making a centered target */
.article-hero.visual-hero .ai-orbit-core{
  width:clamp(120px,11vw,170px);
  right:34% !important;
  top:50% !important;
  transform:translate(50%,-50%) !important;
}

.article-hero.visual-hero .ai-orbit-ring.r1{
  width:64% !important;
  right:5% !important;
  top:18% !important;
}
.article-hero.visual-hero .ai-orbit-ring.r2{
  width:96% !important;
  right:-16% !important;
  top:-2% !important;
}
.article-hero.visual-hero .ai-orbit-ring.r3{
  width:132% !important;
  right:-39% !important;
  top:-25% !important;
}

/* Very large rings bleed beyond top/right/bottom, creating the full responsive background */
.article-hero.visual-hero .article-hero-image.ai-orbit-visual:before{
  width:155% !important;
  right:-48% !important;
  top:-45% !important;
}
.article-hero.visual-hero .article-hero-image.ai-orbit-visual:after{
  width:78% !important;
  right:8% !important;
  top:10% !important;
}

.article-hero.visual-hero .ai-orbit-gridline{
  width:180% !important;
  left:-38% !important;
}

/* Tablet / mobile */
@media(max-width:1000px){
  .article-hero.visual-hero .article-hero-grid{
    grid-template-columns:1fr 1fr;
  }
  .article-hero.visual-hero .article-hero-copy{
    padding-left:32px;
    padding-right:32px;
  }
}

@media(max-width:760px){
  .article-hero.visual-hero .article-hero-grid{
    grid-template-columns:1fr;
  }
  .article-hero.visual-hero .article-hero-copy{
    padding:56px 24px 44px;
  }
  .article-hero.visual-hero .article-hero-image.ai-orbit-visual{
    min-height:320px;
  }
  .article-hero.visual-hero .ai-orbit-core{
    right:50% !important;
    transform:translate(50%,-50%) !important;
  }
  .article-hero.visual-hero .ai-orbit-ring.r1{
    width:54% !important;
    right:23% !important;
  }
  .article-hero.visual-hero .ai-orbit-ring.r2{
    width:82% !important;
    right:9% !important;
  }
  .article-hero.visual-hero .ai-orbit-ring.r3{
    width:115% !important;
    right:-8% !important;
  }
}


/* =========================================================
   v30 — Travel / places article + photo gallery
   ========================================================= */

.travel-hero{
  position:relative;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 84% 20%,rgba(255,84,180,.17),transparent 21%),
    radial-gradient(circle at 72% 58%,rgba(41,163,255,.21),transparent 24%),
    radial-gradient(circle at 92% 76%,rgba(255,190,64,.12),transparent 17%),
    linear-gradient(135deg,#07162e 0%,#092956 48%,#0b407d 100%);
}
.travel-hero:before,
.travel-hero:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(151,207,255,.16);
  pointer-events:none;
}
.travel-hero:before{
  width:520px;height:520px;right:-120px;top:-150px;
  box-shadow:0 0 0 70px rgba(255,74,185,.025),0 0 0 140px rgba(57,157,255,.022);
}
.travel-hero:after{
  width:250px;height:250px;right:240px;bottom:-160px;
}
.travel-hero-grid{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  min-height:520px;
  display:grid;
  grid-template-columns:1fr .92fr;
  gap:46px;
  align-items:center;
  position:relative;
  z-index:2;
}
.travel-hero-copy{padding:80px 0}
.travel-hero h1{
  margin:18px 0 22px;
  font-family:Manrope,sans-serif;
  font-size:clamp(3rem,6vw,5.7rem);
  line-height:.98;
  letter-spacing:-.06em;
  color:#fff;
}
.travel-hero p{
  max-width:680px;
  color:#d7e5f6;
  font-size:1.12rem;
  line-height:1.72;
}
.travel-hero-photo{
  height:430px;
  overflow:hidden;
  border-radius:24px;
  box-shadow:0 30px 80px rgba(0,0,0,.25);
  transform:rotate(1.2deg);
}
.travel-hero-photo img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.travel-location{
  display:inline-flex;align-items:center;gap:8px;
  margin-top:18px;padding:8px 12px;border-radius:999px;
  border:1px solid rgba(255,255,255,.15);
  color:#dceaff;font-size:.82rem;font-weight:800;
}

.travel-article{
  padding:65px 0 100px;
}
.travel-article .container{
  width:min(1050px,calc(100% - 48px));
}
.travel-intro-grid,
.travel-story-grid{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:44px;
  align-items:center;
  margin-bottom:58px;
}
.travel-story-grid.reverse{grid-template-columns:.88fr 1.12fr}
.travel-photo{
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 22px 55px rgba(18,48,83,.12);
}
.travel-photo img{
  width:100%;height:100%;min-height:320px;object-fit:cover;display:block;
}
.travel-text h2{
  font-family:Manrope,sans-serif;
  font-size:clamp(2rem,4vw,3rem);
  letter-spacing:-.04em;
  color:#071d3b;
  margin:0 0 18px;
}
.travel-text p{
  color:#30435d;
  line-height:1.8;
  margin:0 0 20px;
}
.travel-highlight{
  margin:54px 0;
  padding:28px 30px;
  border-radius:20px;
  background:linear-gradient(90deg,#eef5ff,#fff5fb);
  color:#173a63;
  font-size:1.15rem;
  line-height:1.65;
  border:1px solid #e1eafa;
}
.travel-highlight strong{color:#1261ff}

.travel-video{
  margin:58px 0;
  padding:28px;
  border-radius:24px;
  background:#071d3b;
}
.travel-video-head{
  display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:20px;
}
.travel-video-head h2{margin:0;color:#fff;font-size:2rem}
.travel-video-head p{margin:0;color:#adc3dd;font-size:.95rem}
.travel-video video{
  width:100%;
  max-height:640px;
  display:block;
  border-radius:18px;
  background:#000;
}

.gallery-section{margin-top:65px}
.gallery-section h2{
  font-family:Manrope,sans-serif;
  color:#071d3b;
  font-size:clamp(2rem,4vw,3rem);
  letter-spacing:-.04em;
  margin:0 0 12px;
}
.gallery-section>p{color:#61708a;margin:0 0 28px;line-height:1.65}
.photo-gallery{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  grid-auto-rows:190px;
  gap:14px;
}
.gallery-item{
  display:block;
  overflow:hidden;
  border-radius:18px;
  position:relative;
  cursor:zoom-in;
  background:#e9eef5;
}
.gallery-item:nth-child(1){grid-column:span 5;grid-row:span 2}
.gallery-item:nth-child(2){grid-column:span 3;grid-row:span 2}
.gallery-item:nth-child(3){grid-column:span 4;grid-row:span 2}
.gallery-item:nth-child(4){grid-column:span 4;grid-row:span 2}
.gallery-item:nth-child(5){grid-column:span 5;grid-row:span 2}
.gallery-item:nth-child(6){grid-column:span 3;grid-row:span 2}
.gallery-item img{
  width:100%;height:100%;object-fit:cover;display:block;transition:.3s ease;
}
.gallery-item:after{
  content:"↗";
  position:absolute;right:12px;top:12px;
  width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(6,29,59,.72);color:#fff;font-weight:800;
  opacity:0;transition:.25s ease;
}
.gallery-item:hover img{transform:scale(1.035)}
.gallery-item:hover:after{opacity:1}

/* Lightbox */
.lightbox{
  position:fixed;inset:0;z-index:9999;
  display:none;align-items:center;justify-content:center;
  background:rgba(2,10,22,.94);
  padding:30px;
}
.lightbox.open{display:flex}
.lightbox img{
  max-width:min(92vw,1400px);
  max-height:88vh;
  object-fit:contain;
  border-radius:10px;
  box-shadow:0 30px 100px rgba(0,0,0,.45);
}
.lightbox-btn{
  position:absolute;border:0;background:rgba(255,255,255,.1);color:#fff;
  width:48px;height:48px;border-radius:50%;font-size:1.5rem;
  display:grid;place-items:center;cursor:pointer;
  backdrop-filter:blur(8px);
}
.lightbox-close{right:24px;top:24px}
.lightbox-prev{left:24px;top:50%;transform:translateY(-50%)}
.lightbox-next{right:24px;top:50%;transform:translateY(-50%)}
.lightbox-count{
  position:absolute;left:50%;bottom:22px;transform:translateX(-50%);
  color:#dce7f5;font-size:.86rem;font-weight:700;
}

.travel-cat-pill{
  background:rgba(255,255,255,.11)!important;
  color:#ffe3f4!important;
  border:1px solid rgba(255,255,255,.14)!important;
}

@media(max-width:900px){
  .travel-hero-grid,.travel-intro-grid,.travel-story-grid,.travel-story-grid.reverse{grid-template-columns:1fr}
  .travel-hero-photo{height:360px;transform:none;margin-bottom:44px}
  .photo-gallery{grid-template-columns:repeat(2,1fr);grid-auto-rows:240px}
  .gallery-item:nth-child(n){grid-column:span 1;grid-row:span 1}
}
@media(max-width:600px){
  .photo-gallery{grid-template-columns:1fr;grid-auto-rows:300px}
  .travel-video{padding:16px}
  .lightbox-prev{left:8px}.lightbox-next{right:8px}
}


/* v32 — active blog category navigation */
.blog-category-link{color:inherit;text-decoration:none}
.blog-category-link:hover{text-decoration:underline;text-underline-offset:3px}
.blog-category-filters{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:-16px 0 34px;
}
.blog-category-filter{
  display:inline-flex;
  align-items:center;
  min-height:35px;
  padding:0 13px;
  border:1px solid #d7dfeb;
  border-radius:999px;
  background:#fff;
  color:#52627a;
  text-decoration:none;
  font-size:.76rem;
  font-weight:800;
  transition:.2s ease;
}
.blog-category-filter:hover,
.blog-category-filter.active{
  background:#1261ff;
  border-color:#1261ff;
  color:#fff;
}
.blog-footer-list a{
  color:#d8e4f2;
  text-decoration:none;
  font-size:.9rem;
  line-height:1.4;
}
.blog-footer-list a:hover{
  color:#fff;
  text-decoration:underline;
  text-underline-offset:3px;
}


/* =========================================================
   v34 — Strategy article
   ========================================================= */

.strategy-hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 24%,rgba(31,108,255,.22),transparent 28%),
    linear-gradient(135deg,#04162e 0%,#082e5e 52%,#0b4b95 100%);
  color:#fff;
}
.strategy-hero:before,
.strategy-hero:after{
  content:"";
  position:absolute;
  border:1px solid rgba(148,199,255,.16);
  border-radius:50%;
  pointer-events:none;
}
.strategy-hero:before{
  width:560px;height:560px;right:-170px;top:-180px;
  box-shadow:0 0 0 70px rgba(64,139,255,.025),0 0 0 140px rgba(64,139,255,.016);
}
.strategy-hero:after{
  width:260px;height:260px;right:300px;bottom:-150px;
}
.strategy-hero-grid{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  min-height:540px;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:50px;
  align-items:center;
  position:relative;
  z-index:2;
}
.strategy-hero-copy{padding:82px 0}
.strategy-hero h1{
  margin:18px 0 24px;
  font-family:Manrope,sans-serif;
  font-size:clamp(3.1rem,6.2vw,5.9rem);
  line-height:.98;
  letter-spacing:-.06em;
  color:#fff;
}
.strategy-hero p{
  max-width:700px;
  color:#d7e5f6;
  font-size:1.14rem;
  line-height:1.75;
}

.strategy-map{
  position:relative;
  min-height:400px;
  display:grid;
  place-items:center;
}
.strategy-path{
  width:min(100%,480px);
  display:grid;
  grid-template-columns:repeat(5,1fr);
  align-items:center;
  gap:8px;
  position:relative;
}
.strategy-path:before{
  content:"";
  position:absolute;
  left:8%;right:8%;top:50%;
  height:2px;
  background:linear-gradient(90deg,rgba(82,159,255,.3),#4d9eff,rgba(82,159,255,.3));
}
.strategy-node{
  position:relative;
  z-index:2;
  aspect-ratio:1;
  border-radius:50%;
  display:grid;
  place-items:center;
  text-align:center;
  padding:8px;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.05em;
  color:#dceaff;
  background:radial-gradient(circle,#0d61c8,#0a3976 68%,#082a58);
  border:1px solid rgba(145,200,255,.28);
  box-shadow:0 0 30px rgba(0,105,255,.16);
}
.strategy-node.main{
  transform:scale(1.12);
  color:#fff;
  background:radial-gradient(circle,#1678f0,#0b55b6 65%,#083a7d);
  box-shadow:0 0 42px rgba(12,108,255,.35);
}

.strategy-article{
  padding:68px 0 100px;
}
.strategy-article .container{
  width:min(1040px,calc(100% - 48px));
}
.strategy-lead{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:46px;
  align-items:start;
  margin-bottom:56px;
}
.strategy-text h2{
  margin:0 0 18px;
  font-family:Manrope,sans-serif;
  font-size:clamp(2rem,4vw,3rem);
  letter-spacing:-.04em;
  color:#071d3b;
}
.strategy-text p{
  color:#30435d;
  line-height:1.82;
  margin:0 0 20px;
}
.strategy-side{
  border:1px solid #dbe3ef;
  border-radius:22px;
  padding:26px;
  background:linear-gradient(180deg,#f7faff,#fff);
}
.strategy-side .eyebrow{
  color:#1261ff;
  font-size:.74rem;
  text-transform:uppercase;
  letter-spacing:.09em;
  font-weight:800;
}
.strategy-side h3{
  margin:10px 0 14px;
  color:#071d3b;
  font-size:1.45rem;
}
.strategy-side p{margin:0;color:#61708a;line-height:1.65}

.strategy-model{
  margin:58px 0;
}
.strategy-model h2{
  font-family:Manrope,sans-serif;
  font-size:clamp(2rem,4vw,3rem);
  letter-spacing:-.04em;
  margin:0 0 28px;
}
.strategy-steps{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
}
.strategy-step{
  min-height:210px;
  border:1px solid #dbe3ef;
  border-radius:20px;
  padding:22px;
  background:#fff;
  position:relative;
}
.strategy-step .num{
  color:#1261ff;
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.08em;
}
.strategy-step h3{
  margin:28px 0 10px;
  font-size:1.1rem;
  color:#071d3b;
}
.strategy-step p{
  margin:0;
  color:#61708a;
  line-height:1.6;
  font-size:.93rem;
}

.strategy-quote{
  margin:54px 0;
  padding:30px 34px;
  border-radius:20px;
  background:linear-gradient(90deg,#eaf2ff,#f8fbff);
  border:1px solid #d9e6fa;
  color:#17395f;
  font-size:1.2rem;
  line-height:1.6;
}
.strategy-quote strong{
  display:block;
  margin-top:12px;
  color:#1261ff;
  font-size:.9rem;
}

.strategy-comparison{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin:56px 0;
}
.strategy-panel{
  border-radius:22px;
  padding:28px;
  min-height:260px;
}
.strategy-panel.bad{
  background:#f8f9fb;
  border:1px solid #e3e7ee;
}
.strategy-panel.good{
  background:linear-gradient(145deg,#09274d,#0c4c92);
  color:#fff;
}
.strategy-panel h3{margin:0 0 18px;font-size:1.35rem}
.strategy-panel.good h3{color:#fff}
.strategy-panel ul{
  margin:0;
  padding-left:18px;
  display:grid;
  gap:12px;
}
.strategy-panel.bad li{color:#5c6b7e}
.strategy-panel.good li{color:#dce8f6}

.strategy-final{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:40px;
  align-items:center;
  margin-top:54px;
}
.strategy-final-visual{
  min-height:250px;
  border-radius:22px;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 50% 50%,rgba(28,125,255,.25),transparent 30%),
    linear-gradient(145deg,#061c38,#0a4d91);
  overflow:hidden;
}
.strategy-compass{
  width:180px;
  aspect-ratio:1;
  border:1px solid rgba(176,216,255,.38);
  border-radius:50%;
  position:relative;
}
.strategy-compass:before,
.strategy-compass:after{
  content:"";
  position:absolute;
  left:50%;top:50%;
  background:#5ba7ff;
  transform-origin:center;
}
.strategy-compass:before{width:3px;height:72%;transform:translate(-50%,-50%) rotate(28deg)}
.strategy-compass:after{width:72%;height:3px;transform:translate(-50%,-50%) rotate(28deg)}
.strategy-compass span{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:66px;aspect-ratio:1;border-radius:50%;
  display:grid;place-items:center;
  background:#0c64cb;color:#fff;font-weight:800;
  box-shadow:0 0 30px rgba(12,100,203,.5);
}

@media(max-width:900px){
  .strategy-hero-grid,.strategy-lead,.strategy-final,.strategy-comparison{grid-template-columns:1fr}
  .strategy-path{max-width:520px}
  .strategy-steps{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .strategy-steps{grid-template-columns:1fr}
  .strategy-path{grid-template-columns:1fr;max-width:260px;gap:12px}
  .strategy-path:before{left:50%;right:auto;top:8%;bottom:8%;width:2px;height:auto}
  .strategy-node{width:110px;justify-self:center}
}

/* v34 dynamic cover for posts without raster image */
.dynamic-cover{
  width:100%;height:100%;min-height:180px;
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;
  color:#fff;position:relative;overflow:hidden;
}
.dynamic-cover-strategy{
  background:
    radial-gradient(circle at 70% 35%,rgba(61,149,255,.25),transparent 24%),
    linear-gradient(145deg,#071d3c,#0b4d96);
}
.dynamic-cover-strategy:before,
.dynamic-cover-strategy:after{
  content:"";position:absolute;border:1px solid rgba(157,207,255,.22);border-radius:50%;
}
.dynamic-cover-strategy:before{width:260px;height:260px;right:-80px;top:-100px}
.dynamic-cover-strategy:after{width:160px;height:160px;left:-50px;bottom:-70px}
.dynamic-cover span{position:relative;z-index:2;font-size:.76rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.dynamic-cover strong{position:relative;z-index:2;font-size:3rem}
.blog-card-cover{height:150px;margin:-30px -30px 24px;overflow:hidden}
.blog-card.featured .blog-card-cover{margin:-30px -30px 24px}


/* =========================================================
   v35 — NEXOVIA Consult LLC project article
   ========================================================= */
.nexovia-hero{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 82% 18%,rgba(255,35,35,.12),transparent 25%),
    linear-gradient(135deg,#050505 0%,#10151d 50%,#171717 100%);
  color:#fff;
}
.nexovia-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(115deg,transparent 0 64%,rgba(255,0,0,.08) 64% 64.15%,transparent 64.15%),
    linear-gradient(25deg,transparent 0 76%,rgba(255,255,255,.05) 76% 76.12%,transparent 76.12%);
  pointer-events:none;
}
.nexovia-hero-grid{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  min-height:560px;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:48px;
  align-items:center;
  position:relative;
  z-index:2;
}
.nexovia-hero-copy{padding:80px 0}
.nexovia-hero h1{
  margin:18px 0 22px;
  font-family:Manrope,sans-serif;
  font-size:clamp(3.05rem,6vw,5.7rem);
  line-height:.98;
  letter-spacing:-.06em;
  color:#fff;
}
.nexovia-hero p{
  color:#d6dbe3;
  font-size:1.13rem;
  line-height:1.75;
  max-width:690px;
}
.nexovia-hero-logo{
  display:grid;
  place-items:center;
  padding:38px;
}
.nexovia-hero-logo img{
  width:min(100%,520px);
  aspect-ratio:1;
  object-fit:cover;
  border-radius:50%;
  box-shadow:0 30px 90px rgba(0,0,0,.45);
}

.nexovia-article{
  padding:70px 0 100px;
}
.nexovia-article .container{
  width:min(1050px,calc(100% - 48px));
}
.nexovia-intro{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:44px;
  align-items:center;
  margin-bottom:58px;
}
.nexovia-text h2{
  margin:0 0 18px;
  font-family:Manrope,sans-serif;
  font-size:clamp(2rem,4vw,3rem);
  letter-spacing:-.04em;
  color:#071d3b;
}
.nexovia-text p{
  margin:0 0 20px;
  color:#30435d;
  line-height:1.82;
}
.nexovia-visual{
  overflow:hidden;
  border-radius:22px;
  box-shadow:0 22px 60px rgba(14,31,55,.15);
}
.nexovia-visual img{
  width:100%;
  height:100%;
  min-height:340px;
  object-fit:cover;
  display:block;
}

.nexovia-pillars{
  margin:58px 0;
}
.nexovia-pillars h2{
  font-family:Manrope,sans-serif;
  font-size:clamp(2rem,4vw,3rem);
  letter-spacing:-.04em;
  margin:0 0 28px;
}
.nexovia-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}
.nexovia-card{
  min-height:220px;
  padding:24px;
  border-radius:20px;
  background:linear-gradient(145deg,#0b1119,#171f2a);
  color:#fff;
  border:1px solid rgba(255,255,255,.08);
  position:relative;
  overflow:hidden;
}
.nexovia-card:before{
  content:"";
  position:absolute;
  width:90px;height:90px;border-radius:50%;
  right:-28px;top:-28px;
  border:1px solid rgba(255,55,55,.18);
}
.nexovia-card span{
  color:#ff3c3c;
  font-size:.74rem;
  font-weight:800;
  letter-spacing:.08em;
}
.nexovia-card h3{
  margin:34px 0 10px;
  color:#fff;
  font-size:1.25rem;
}
.nexovia-card p{
  color:#c9d1dc;
  margin:0;
  line-height:1.62;
  font-size:.94rem;
}

.nexovia-timeline{
  margin:58px 0;
  padding:30px;
  border-radius:22px;
  background:#f7f9fc;
  border:1px solid #e0e6ee;
}
.nexovia-timeline h2{
  margin:0 0 26px;
  font-family:Manrope,sans-serif;
  font-size:2.2rem;
}
.nexovia-timeline-track{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.nexovia-stage{
  padding:20px;
  border-top:3px solid #d4dce8;
}
.nexovia-stage.active{border-color:#f12727}
.nexovia-stage b{
  display:block;
  margin-bottom:8px;
  color:#071d3b;
}
.nexovia-stage p{
  margin:0;color:#65748a;line-height:1.55;font-size:.92rem;
}

.nexovia-quote{
  margin:54px 0;
  padding:30px 34px;
  border-radius:20px;
  background:linear-gradient(100deg,#10141b,#191919);
  color:#f1f3f6;
  border-left:4px solid #ef2b2b;
  font-size:1.18rem;
  line-height:1.65;
}
.nexovia-quote strong{
  display:block;
  margin-top:12px;
  color:#ff4747;
  font-size:.9rem;
}

.nexovia-final{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:44px;
  align-items:center;
  margin-top:58px;
}
.nexovia-final .nexovia-visual img{
  min-height:420px;
}

.dynamic-cover-projects{
  background:
    radial-gradient(circle at 68% 30%,rgba(255,45,45,.2),transparent 25%),
    linear-gradient(145deg,#090909,#1a1f28);
}
.dynamic-cover-projects:before,
.dynamic-cover-projects:after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(255,60,60,.18);
}
.dynamic-cover-projects:before{width:250px;height:250px;right:-80px;top:-100px}
.dynamic-cover-projects:after{width:150px;height:150px;left:-40px;bottom:-70px}

@media(max-width:900px){
  .nexovia-hero-grid,.nexovia-intro,.nexovia-final{grid-template-columns:1fr}
  .nexovia-grid{grid-template-columns:1fr 1fr}
  .nexovia-timeline-track{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .nexovia-grid,.nexovia-timeline-track{grid-template-columns:1fr}
  .nexovia-hero-logo{padding:10px 0 42px}
}

/* v36 Webentwicklung case study */
.webdev-hero{background:linear-gradient(120deg,#061a3a 0%,#0a2d63 55%,#0b55c9 100%);color:#fff;padding:76px 0}
.webdev-hero-grid{width:min(1180px,calc(100% - 48px));margin:auto;display:grid;grid-template-columns:1fr .92fr;gap:54px;align-items:center}
.webdev-hero h1{font-family:Manrope,sans-serif;font-size:clamp(3rem,5.8vw,5.6rem);line-height:.98;letter-spacing:-.055em;margin:18px 0 22px;color:#fff}
.webdev-hero p{font-size:1.12rem;line-height:1.75;color:#d9e7ff}
.webdev-hero img{width:100%;border-radius:24px;box-shadow:0 30px 80px rgba(0,0,0,.28)}
.webdev-body{padding:70px 0 100px}.webdev-body .container{width:min(1050px,calc(100% - 48px))}
.webdev-body h2{font-family:Manrope,sans-serif;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.04em;color:#071d3b;margin:0 0 18px}
.webdev-body p{color:#30435d;line-height:1.82}
.tech-badges{display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 52px}
.tech-badge{padding:11px 16px;border-radius:999px;background:#eef5ff;border:1px solid #c9ddff;color:#0746aa;font-weight:800;font-size:.84rem}
.webdev-six{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0 58px}
.webdev-card{padding:25px;border:1px solid #dbe3ef;border-radius:20px;background:#fff;min-height:190px}
.webdev-card b{display:block;color:#1260e8;font-size:.76rem;letter-spacing:.08em;margin-bottom:35px}
.webdev-card h3{margin:0 0 10px;color:#071d3b}.webdev-card p{font-size:.94rem;margin:0}
.webdev-image{margin:46px 0;overflow:hidden;border-radius:24px;box-shadow:0 20px 55px rgba(17,45,83,.12)}
.webdev-image img{width:100%;display:block}
.webdev-flow{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin:26px 0 54px}
.webdev-flow span{padding:12px 15px;background:#071d3b;color:#fff;border-radius:10px;font-weight:700}.webdev-flow i{font-style:normal;color:#1260e8;font-weight:900}
.webdev-quote{margin:52px 0;padding:30px 34px;background:linear-gradient(100deg,#eaf2ff,#f6f9ff);border-left:4px solid #1260e8;border-radius:18px;color:#08295c;font-size:1.2rem;line-height:1.65}
.dynamic-cover-webdev{background:linear-gradient(135deg,#061a3a,#0b55c9)}
.dynamic-cover-webdev:before{content:"</>";position:absolute;right:34px;bottom:18px;font:800 5rem Manrope;color:rgba(255,255,255,.12)}
@media(max-width:850px){.webdev-hero-grid{grid-template-columns:1fr}.webdev-six{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.webdev-six{grid-template-columns:1fr}}

/* v37 Productivity article */
.productivity-hero{background:linear-gradient(130deg,#061a39,#0a326d 58%,#1265cf);color:#fff;padding:76px 0}
.productivity-hero-grid{width:min(1180px,calc(100% - 48px));margin:auto;display:grid;grid-template-columns:1fr .92fr;gap:52px;align-items:center}
.productivity-hero h1{font-family:Manrope,sans-serif;font-size:clamp(3rem,5.8vw,5.5rem);line-height:.98;letter-spacing:-.055em;margin:18px 0 22px;color:#fff}
.productivity-hero p{font-size:1.12rem;line-height:1.75;color:#dce9fb}
.productivity-hero img{width:100%;border-radius:24px;box-shadow:0 30px 80px rgba(0,0,0,.25)}
.productivity-body{padding:70px 0 100px}.productivity-body .container{width:min(1050px,calc(100% - 48px))}
.productivity-body h2{font-family:Manrope,sans-serif;font-size:clamp(2rem,4vw,3rem);letter-spacing:-.04em;color:#071d3b;margin:0 0 18px}
.productivity-body p{color:#30435d;line-height:1.82}
.productivity-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0 58px}
.productivity-card{padding:25px;border:1px solid #dbe3ef;border-radius:20px;background:#fff;min-height:210px}
.productivity-card b{display:block;color:#1260e8;font-size:.76rem;letter-spacing:.08em;margin-bottom:30px}
.productivity-card h3{margin:0 0 10px;color:#071d3b}.productivity-card p{font-size:.94rem;margin:0}
.productivity-system{margin:52px 0;padding:32px;border-radius:24px;background:#f5f8fd;border:1px solid #dce5f2}
.productivity-flow{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin:24px 0 10px}
.productivity-flow span{padding:12px 15px;background:#071d3b;color:#fff;border-radius:10px;font-weight:700}.productivity-flow i{font-style:normal;color:#1260e8;font-weight:900}
.productivity-image{margin:46px 0;overflow:hidden;border-radius:24px;box-shadow:0 20px 55px rgba(17,45,83,.13)}.productivity-image img{width:100%;display:block}
.productivity-stop{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:48px 0}
.productivity-stop>div{padding:28px;border-radius:22px}
.productivity-stop .less{background:#f4f5f7;border:1px solid #e0e4e9}.productivity-stop .more{background:linear-gradient(140deg,#071d3b,#0b4f9d);color:#fff}
.productivity-stop h3{margin:0 0 18px}.productivity-stop .more h3{color:#fff}.productivity-stop ul{padding-left:20px;line-height:1.75}.productivity-stop .less li{color:#56677c}.productivity-stop .more li{color:#dce9f8}
.productivity-quote{margin:52px 0;padding:30px 34px;background:linear-gradient(100deg,#eaf2ff,#f8fbff);border-left:4px solid #1260e8;border-radius:18px;color:#08295c;font-size:1.2rem;line-height:1.65}
.dynamic-cover-productivity{background:linear-gradient(135deg,#061a3a,#1265cf)}
.dynamic-cover-productivity:before{content:"✓";position:absolute;right:35px;bottom:5px;font:800 7rem Manrope;color:rgba(255,255,255,.11)}
@media(max-width:850px){.productivity-hero-grid{grid-template-columns:1fr}.productivity-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.productivity-grid,.productivity-stop{grid-template-columns:1fr}}


/* =========================================================
   v37.3 — compact equal-size blog cards
   ========================================================= */

.blog-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
  align-items:stretch !important;
}

.blog-card,
.blog-card.featured{
  grid-column:auto !important;
  min-width:0 !important;
  min-height:390px !important;
  height:100% !important;
  padding:24px !important;
  border-radius:20px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
}

.blog-card.featured{
  background:linear-gradient(145deg,#0a2b57,#124d91) !important;
}

.blog-card .blog-meta{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  align-items:center !important;
  margin-bottom:20px !important;
}

.blog-card h2{
  font-size:clamp(1.45rem,2vw,2rem) !important;
  line-height:1.08 !important;
  letter-spacing:-.035em !important;
  margin:0 0 16px !important;

  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.blog-card p{
  font-size:.96rem !important;
  line-height:1.62 !important;
  margin:0 !important;

  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.blog-card .blog-read{
  margin-top:24px !important;
  align-self:flex-start !important;
}

.blog-card-cover{
  height:130px !important;
  margin:-24px -24px 20px !important;
}

.blog-card.featured .blog-card-cover{
  margin:-24px -24px 20px !important;
}

.blog-card-cover .dynamic-cover{
  min-height:130px !important;
}

@media(max-width:980px){
  .blog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media(max-width:640px){
  .blog-grid{
    grid-template-columns:1fr !important;
  }

  .blog-card,
  .blog-card.featured{
    min-height:340px !important;
  }
}


/* v38 — Digital Transformation article */
.dt-hero{background:linear-gradient(125deg,#06182f 0%,#0b315f 55%,#1269d3 100%);color:#fff;padding:72px 0 64px;overflow:hidden}
.dt-hero-grid{width:min(1180px,calc(100% - 48px));margin:auto;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.dt-hero h1{font-size:clamp(3rem,6vw,5.7rem);line-height:.94;letter-spacing:-.055em;margin:24px 0}
.dt-hero p{font-size:1.18rem;line-height:1.65;max-width:720px;color:#d8e6f8}
.dt-visual{min-height:430px;position:relative;display:grid;place-items:center}
.dt-orbit{width:min(420px,90%);aspect-ratio:1;border:1px solid rgba(255,255,255,.28);border-radius:50%;display:grid;place-items:center;position:relative}
.dt-orbit:before,.dt-orbit:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.2);border-radius:50%}
.dt-orbit:before{inset:12%}.dt-orbit:after{inset:27%}
.dt-core{width:150px;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#1d83ff,#06419b);box-shadow:0 25px 70px rgba(0,0,0,.35);font-weight:800;font-size:1.45rem;z-index:2;text-align:center}
.dt-body{padding:70px 0 90px}.dt-body .container{max-width:1180px}.dt-body h2{font-size:clamp(2rem,3.4vw,3rem);letter-spacing:-.035em;margin:58px 0 18px}.dt-body> .container > p{max-width:850px;font-size:1.08rem;line-height:1.8;color:#42536c}
.dt-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0}
.dt-step{border:1px solid #dbe4ef;border-radius:20px;padding:24px;background:#fff;min-height:190px}.dt-step b{color:#0867ff;font-size:.82rem}.dt-step h3{margin:34px 0 10px;font-size:1.15rem}.dt-step p{color:#61718a;line-height:1.55}
.dt-before-after{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:28px 0}.dt-panel{padding:30px;border-radius:22px}.dt-panel.before{background:#f3f5f8}.dt-panel.after{background:#092d59;color:#fff}.dt-panel h3{font-size:1.6rem;margin:0 0 20px}.dt-panel ul{margin:0;padding-left:20px}.dt-panel li{margin:12px 0;line-height:1.5}
.dt-quote{margin:52px 0;padding:34px 38px;border-radius:22px;background:linear-gradient(120deg,#eaf2ff,#f7faff);font-size:1.5rem;font-weight:700;line-height:1.45;color:#09254b;border-left:5px solid #0867ff}
.dt-chain{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:30px 0}.dt-chain span{padding:12px 16px;border-radius:999px;background:#eaf2ff;color:#073e86;font-weight:700;font-size:.82rem}.dt-chain i{font-style:normal;color:#0867ff;font-weight:800}
@media(max-width:850px){.dt-hero-grid{grid-template-columns:1fr}.dt-visual{min-height:310px}.dt-steps{grid-template-columns:1fr 1fr}.dt-before-after{grid-template-columns:1fr}}
@media(max-width:560px){.dt-hero{padding-top:45px}.dt-hero-grid{width:min(100% - 28px,1180px)}.dt-steps{grid-template-columns:1fr}.dt-hero h1{font-size:2.8rem}.dt-orbit{width:280px}.dt-core{width:110px}.dt-body{padding-top:45px}}


/* =========================================================
   v38.2 — robust mobile navigation + language switcher
   ========================================================= */
@media (max-width: 980px){
  .site-header{
    overflow:visible !important;
  }

  .site-header .nav-wrap{
    min-height:0 !important;
    padding-top:10px !important;
    padding-bottom:9px !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 46px !important;
    grid-template-areas:
      "brand toggle"
      "langs langs" !important;
    column-gap:10px !important;
    row-gap:8px !important;
    align-items:center !important;
  }

  .site-header .brand{
    grid-area:brand !important;
    margin:0 !important;
    min-width:0 !important;
    white-space:nowrap !important;
  }

  .site-header .nav-toggle{
    grid-area:toggle !important;
    display:block !important;
    width:44px !important;
    height:44px !important;
    justify-self:end !important;
    position:relative !important;
    z-index:1302 !important;
    border:1px solid var(--border) !important;
    border-radius:12px !important;
    background:rgba(255,255,255,.92) !important;
  }

  .site-header .language-switcher{
    grid-area:langs !important;
    display:flex !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    scrollbar-width:none !important;
    justify-content:center !important;
    gap:4px !important;
    padding:4px !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  .site-header .language-switcher::-webkit-scrollbar{
    display:none !important;
  }

  .site-header .language-switcher a{
    flex:0 0 36px !important;
    width:36px !important;
    min-width:36px !important;
    height:36px !important;
    padding:0 !important;
    font-size:.68rem !important;
  }

  .site-header .nav{
    display:none !important;
  }

  .site-header .nav.open{
    position:fixed !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:0 !important;
    top:118px !important;
    left:12px !important;
    right:12px !important;
    width:auto !important;
    max-height:calc(100dvh - 132px) !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch !important;
    padding:10px !important;
    background:rgba(255,255,255,.98) !important;
    backdrop-filter:blur(18px) !important;
    border:1px solid var(--border) !important;
    border-radius:18px !important;
    box-shadow:0 22px 60px rgba(7,26,51,.2) !important;
    z-index:1300 !important;
  }

  .site-header .nav.open a{
    display:block !important;
    width:100% !important;
    padding:14px 15px !important;
    border-radius:11px !important;
    font-size:1rem !important;
    box-sizing:border-box !important;
  }

  .site-header .nav.open a:hover,
  .site-header .nav.open a:focus{
    background:var(--soft) !important;
  }

  body.mobile-menu-open{
    overflow:hidden !important;
  }

  /* Header is two rows on mobile; provide enough top space for hero/content. */
  .hero{
    padding-top:150px !important;
  }

  .blog-hero{
    padding-top:150px !important;
  }
}

@media (max-width: 420px){
  .site-header .container{
    width:calc(100% - 20px) !important;
  }

  .site-header .brand{
    font-size:1.18rem !important;
  }

  .site-header .language-switcher{
    justify-content:space-between !important;
  }

  .site-header .language-switcher a{
    flex:0 0 34px !important;
    width:34px !important;
    min-width:34px !important;
    height:34px !important;
  }
}

/* Very short landscape screens: keep menu usable by scrolling inside it. */
@media (max-width:980px) and (max-height:520px){
  .site-header .nav.open{
    top:76px !important;
    max-height:calc(100dvh - 88px) !important;
  }
  .site-header .language-switcher{
    position:absolute !important;
    top:10px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    width:auto !important;
    max-width:calc(100% - 150px) !important;
  }
  .site-header .nav-wrap{
    grid-template-areas:"brand toggle" !important;
    padding-bottom:10px !important;
  }
}

/* v38.5 — CV mobile header consistency */
@media (max-width: 980px){
  .site-header + main .page-hero,
  main > .page-hero:first-child{
    padding-top:150px !important;
  }
}

/* v39 — Manasija article source box */
.travel-sources{margin:54px 0 22px;padding:26px 30px;border:1px solid #dbe4ef;border-radius:20px;background:#f7f9fc}
.travel-sources h2{margin:0 0 12px}.travel-sources p{margin:0 0 12px;color:#586a82;line-height:1.65}
.travel-sources a{color:#0965e8;font-weight:700;text-decoration:none}.travel-sources a:hover{text-decoration:underline}


/* =========================================================
   v39.1 — Manasija gallery: correct final three images
   ========================================================= */
.photo-gallery .gallery-item:nth-child(7),
.photo-gallery .gallery-item:nth-child(8),
.photo-gallery .gallery-item:nth-child(9){
  grid-column:span 4;
  grid-row:span 2;
  min-width:0;
}

@media(max-width:850px){
  .photo-gallery .gallery-item:nth-child(7),
  .photo-gallery .gallery-item:nth-child(8),
  .photo-gallery .gallery-item:nth-child(9){
    grid-column:span 6;
    grid-row:span 2;
  }

  .photo-gallery .gallery-item:nth-child(9){
    grid-column:span 12;
  }
}

@media(max-width:560px){
  .photo-gallery .gallery-item:nth-child(7),
  .photo-gallery .gallery-item:nth-child(8),
  .photo-gallery .gallery-item:nth-child(9){
    grid-column:span 12;
    grid-row:span 2;
  }
}


/* =========================================================
   v40 — Resava Cave article
   ========================================================= */
.cave-hero{
  padding:72px 0 64px;
  color:#fff;
  background:
    radial-gradient(circle at 82% 24%,rgba(234,165,78,.22),transparent 23%),
    linear-gradient(130deg,#120d0a,#332117 53%,#76512e);
}
.cave-hero-grid{
  width:min(1180px,calc(100% - 48px));
  margin:auto;
  display:grid;
  grid-template-columns:1.03fr .97fr;
  gap:48px;
  align-items:center;
}
.cave-hero h1{
  margin:20px 0;
  color:#fff;
  font-size:clamp(3rem,5.8vw,5.35rem);
  line-height:.96;
  letter-spacing:-.055em;
}
.cave-hero p{font-size:1.12rem;line-height:1.72;color:#eadfd5}
.cave-hero-photo{
  overflow:hidden;
  min-height:470px;
  border-radius:28px;
  box-shadow:0 32px 90px rgba(0,0,0,.38);
}
.cave-hero-photo img{width:100%;height:100%;min-height:470px;object-fit:cover;display:block}
.cave-article{background:#fbfaf8}
.cave-photo{background:#251a14}
.cave-photo.portrait img{object-position:center 38%}
.cave-rules{
  display:grid;
  grid-template-columns:1fr .78fr;
  gap:22px;
  margin:54px 0;
  overflow:hidden;
  border-radius:25px;
  background:#19130f;
  color:#fff;
}
.cave-rules>div{padding:38px}
.cave-rules span{color:#d9984c;font-weight:800;letter-spacing:.14em}
.cave-rules h2{color:#fff;margin:20px 0 16px}
.cave-rules p{color:#ddd0c5;line-height:1.75}
.cave-rules figure{margin:0;min-height:420px}
.cave-rules img{width:100%;height:100%;object-fit:cover;display:block}
.cave-highlight{
  background:linear-gradient(120deg,#3a2618,#81582e);
  border-left-color:#e4a24d;
  color:#fff;
}
.cave-route-cards{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin:55px 0;
}
.cave-route-cards article{
  padding:30px;
  border-radius:22px;
  border:1px solid #ddd2c7;
  background:#fff;
}
.cave-route-cards article:nth-child(2){
  color:#fff;
  background:linear-gradient(145deg,#1c1510,#5e4027);
}
.cave-route-cards b{color:#bc762c;letter-spacing:.15em;font-size:.78rem}
.cave-route-cards h2{margin:18px 0 14px}
.cave-route-cards article:nth-child(2) h2{color:#fff}
.cave-route-cards p{line-height:1.72;color:#5c5149}
.cave-route-cards article:nth-child(2) p{color:#e4d9ce}
.cave-gallery{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-auto-rows:210px;
  gap:14px;
  margin-top:24px;
}
.cave-gallery-item{
  display:block;
  min-width:0;
  overflow:hidden;
  border-radius:17px;
  background:#21160f;
}
.cave-gallery-item img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .35s ease;
}
.cave-gallery-item:hover img{transform:scale(1.035)}
.cave-gallery-item:nth-child(1),
.cave-gallery-item:nth-child(4),
.cave-gallery-item:nth-child(12){grid-column:span 2}
.cave-gallery-item:nth-child(2),
.cave-gallery-item:nth-child(3),
.cave-gallery-item:nth-child(6),
.cave-gallery-item:nth-child(10){grid-row:span 2}
@media(max-width:900px){
  .cave-hero-grid{grid-template-columns:1fr}
  .cave-hero-photo,.cave-hero-photo img{min-height:390px}
  .cave-rules{grid-template-columns:1fr}
  .cave-rules figure{min-height:320px}
  .cave-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cave-gallery-item:nth-child(n){grid-column:span 1}
  .cave-gallery-item:nth-child(1),
  .cave-gallery-item:nth-child(4),
  .cave-gallery-item:nth-child(12){grid-column:span 2}
  .cave-route-cards{grid-template-columns:1fr}
}
@media(max-width:560px){
  .cave-hero{padding:48px 0}
  .cave-hero-grid{width:calc(100% - 28px)}
  .cave-hero h1{font-size:2.75rem}
  .cave-hero-photo,.cave-hero-photo img{min-height:290px}
  .cave-rules>div{padding:25px}
  .cave-gallery{grid-template-columns:1fr;grid-auto-rows:260px}
  .cave-gallery-item:nth-child(n){grid-column:span 1;grid-row:span 1}
}


/* =========================================================
   v40.2 — Resava article compact hero + standard gallery
   ========================================================= */
.cave-hero.cave-hero-compact{
  padding:42px 0 38px !important;
}

.cave-hero.cave-hero-compact .cave-hero-grid{
  grid-template-columns:1fr 1fr !important;
  gap:34px !important;
  align-items:center !important;
}

.cave-hero.cave-hero-compact .cave-hero h1,
.cave-hero.cave-hero-compact h1{
  font-size:clamp(2.5rem,4.7vw,4.5rem) !important;
  line-height:1 !important;
}

.cave-hero.cave-hero-compact .cave-hero-photo{
  min-height:320px !important;
  max-height:430px !important;
  border-radius:24px !important;
}

.cave-hero.cave-hero-compact .cave-hero-photo img{
  min-height:320px !important;
  height:100% !important;
  max-height:430px !important;
  object-fit:cover !important;
}

/* Same mosaic behavior as the other travel articles */
.resava-photo-gallery{
  display:grid !important;
  grid-template-columns:repeat(12,minmax(0,1fr)) !important;
  grid-auto-rows:150px !important;
  gap:14px !important;
  margin-top:24px !important;
}

.resava-photo-gallery .resava-gallery-item{
  display:block !important;
  min-width:0 !important;
  overflow:hidden !important;
  border-radius:17px !important;
  background:#21160f !important;
  grid-column:span 4 !important;
  grid-row:span 2 !important;
}

.resava-photo-gallery .resava-gallery-item:nth-child(1),
.resava-photo-gallery .resava-gallery-item:nth-child(4),
.resava-photo-gallery .resava-gallery-item:nth-child(12){
  grid-column:span 6 !important;
}

.resava-photo-gallery .resava-gallery-item:nth-child(2),
.resava-photo-gallery .resava-gallery-item:nth-child(3),
.resava-photo-gallery .resava-gallery-item:nth-child(6),
.resava-photo-gallery .resava-gallery-item:nth-child(10){
  grid-row:span 3 !important;
}

.resava-photo-gallery .resava-gallery-item img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
  transition:transform .35s ease !important;
}

.resava-photo-gallery .resava-gallery-item:hover img{
  transform:scale(1.035) !important;
}

@media(max-width:900px){
  .cave-hero.cave-hero-compact .cave-hero-grid{
    grid-template-columns:1fr !important;
  }

  .cave-hero.cave-hero-compact .cave-hero-photo,
  .cave-hero.cave-hero-compact .cave-hero-photo img{
    min-height:280px !important;
    max-height:360px !important;
  }

  .resava-photo-gallery .resava-gallery-item{
    grid-column:span 6 !important;
  }

  .resava-photo-gallery .resava-gallery-item:nth-child(13){
    grid-column:span 12 !important;
  }
}

@media(max-width:560px){
  .cave-hero.cave-hero-compact{
    padding:34px 0 30px !important;
  }

  .cave-hero.cave-hero-compact h1{
    font-size:2.55rem !important;
  }

  .cave-hero.cave-hero-compact .cave-hero-photo,
  .cave-hero.cave-hero-compact .cave-hero-photo img{
    min-height:235px !important;
    max-height:300px !important;
  }

  .resava-photo-gallery{
    grid-template-columns:1fr !important;
    grid-auto-rows:260px !important;
  }

  .resava-photo-gallery .resava-gallery-item,
  .resava-photo-gallery .resava-gallery-item:nth-child(n){
    grid-column:span 1 !important;
    grid-row:span 1 !important;
  }
}


/* =========================================================
   v40.3 — FINAL Resava Cave hero + gallery correction
   These rules intentionally come last and target only
   the Resava Cave article.
   ========================================================= */

/* HERO: fixed compact two-column block on desktop */
body:has(.cave-hero-compact) .cave-hero.cave-hero-compact{
  padding:34px 0 34px !important;
  min-height:0 !important;
  height:auto !important;
}

body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-grid{
  width:min(1180px,calc(100% - 48px)) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr) !important;
  gap:34px !important;
  align-items:center !important;
}

body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-copy{
  min-width:0 !important;
}

body:has(.cave-hero-compact) .cave-hero.cave-hero-compact h1{
  margin:16px 0 18px !important;
  font-size:clamp(2.6rem,4vw,4.15rem) !important;
  line-height:1.01 !important;
  letter-spacing:-.045em !important;
}

body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-photo{
  width:100% !important;
  height:360px !important;
  min-height:360px !important;
  max-height:360px !important;
  overflow:hidden !important;
  border-radius:24px !important;
}

body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-photo img{
  display:block !important;
  width:100% !important;
  height:360px !important;
  min-height:360px !important;
  max-height:360px !important;
  object-fit:cover !important;
  object-position:center 48% !important;
}

/* GALLERY: every item receives an explicit safe span */
body:has(.resava-photo-gallery) .resava-photo-gallery{
  display:grid !important;
  grid-template-columns:repeat(12,minmax(0,1fr)) !important;
  grid-auto-flow:dense !important;
  grid-auto-rows:145px !important;
  gap:14px !important;
  align-items:stretch !important;
}

body:has(.resava-photo-gallery) .resava-photo-gallery > .resava-gallery-item,
body:has(.resava-photo-gallery) .resava-photo-gallery > .gallery-item{
  display:block !important;
  min-width:0 !important;
  width:auto !important;
  height:auto !important;
  overflow:hidden !important;
  border-radius:17px !important;
  grid-column:span 4 !important;
  grid-row:span 2 !important;
}

/* A balanced mosaic for 13 photographs */
body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(1),
body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(4),
body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(12){
  grid-column:span 6 !important;
  grid-row:span 2 !important;
}

body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(2),
body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(3),
body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(6){
  grid-column:span 3 !important;
  grid-row:span 3 !important;
}

/* Explicitly prevent the last four from becoming narrow strips */
body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(10),
body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(11),
body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(12),
body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(13){
  grid-column:span 3 !important;
  grid-row:span 2 !important;
}

body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(12){
  grid-column:span 3 !important;
}

body:has(.resava-photo-gallery) .resava-photo-gallery > .resava-gallery-item img,
body:has(.resava-photo-gallery) .resava-photo-gallery > .gallery-item img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  object-fit:cover !important;
}

@media(max-width:900px){
  body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-grid{
    grid-template-columns:1fr !important;
  }

  body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-photo,
  body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-photo img{
    height:320px !important;
    min-height:320px !important;
    max-height:320px !important;
  }

  body:has(.resava-photo-gallery) .resava-photo-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    grid-auto-rows:240px !important;
  }

  body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(n){
    grid-column:span 1 !important;
    grid-row:span 1 !important;
  }

  body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(1),
  body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(4),
  body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(13){
    grid-column:span 2 !important;
  }
}

@media(max-width:560px){
  body:has(.cave-hero-compact) .cave-hero.cave-hero-compact{
    padding:28px 0 !important;
  }

  body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-grid{
    width:calc(100% - 28px) !important;
  }

  body:has(.cave-hero-compact) .cave-hero.cave-hero-compact h1{
    font-size:2.45rem !important;
  }

  body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-photo,
  body:has(.cave-hero-compact) .cave-hero.cave-hero-compact .cave-hero-photo img{
    height:245px !important;
    min-height:245px !important;
    max-height:245px !important;
  }

  body:has(.resava-photo-gallery) .resava-photo-gallery{
    grid-template-columns:1fr !important;
    grid-auto-rows:260px !important;
  }

  body:has(.resava-photo-gallery) .resava-photo-gallery > :nth-child(n){
    grid-column:span 1 !important;
    grid-row:span 1 !important;
  }
}



/* =========================================================
   v40.3 compatibility selectors
   These rules intentionally come last and target only
   the Resava Cave article.
   ========================================================= */

/* HERO: fixed compact two-column block on desktop */
body.resava-cave-page .cave-hero.cave-hero-compact{
  padding:34px 0 34px !important;
  min-height:0 !important;
  height:auto !important;
}

body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-grid{
  width:min(1180px,calc(100% - 48px)) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr) !important;
  gap:34px !important;
  align-items:center !important;
}

body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-copy{
  min-width:0 !important;
}

body.resava-cave-page .cave-hero.cave-hero-compact h1{
  margin:16px 0 18px !important;
  font-size:clamp(2.6rem,4vw,4.15rem) !important;
  line-height:1.01 !important;
  letter-spacing:-.045em !important;
}

body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-photo{
  width:100% !important;
  height:360px !important;
  min-height:360px !important;
  max-height:360px !important;
  overflow:hidden !important;
  border-radius:24px !important;
}

body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-photo img{
  display:block !important;
  width:100% !important;
  height:360px !important;
  min-height:360px !important;
  max-height:360px !important;
  object-fit:cover !important;
  object-position:center 48% !important;
}

/* GALLERY: every item receives an explicit safe span */
body.resava-cave-page .resava-photo-gallery{
  display:grid !important;
  grid-template-columns:repeat(12,minmax(0,1fr)) !important;
  grid-auto-flow:dense !important;
  grid-auto-rows:145px !important;
  gap:14px !important;
  align-items:stretch !important;
}

body.resava-cave-page .resava-photo-gallery > .resava-gallery-item,
body.resava-cave-page .resava-photo-gallery > .gallery-item{
  display:block !important;
  min-width:0 !important;
  width:auto !important;
  height:auto !important;
  overflow:hidden !important;
  border-radius:17px !important;
  grid-column:span 4 !important;
  grid-row:span 2 !important;
}

/* A balanced mosaic for 13 photographs */
body.resava-cave-page .resava-photo-gallery > :nth-child(1),
body.resava-cave-page .resava-photo-gallery > :nth-child(4),
body.resava-cave-page .resava-photo-gallery > :nth-child(12){
  grid-column:span 6 !important;
  grid-row:span 2 !important;
}

body.resava-cave-page .resava-photo-gallery > :nth-child(2),
body.resava-cave-page .resava-photo-gallery > :nth-child(3),
body.resava-cave-page .resava-photo-gallery > :nth-child(6){
  grid-column:span 3 !important;
  grid-row:span 3 !important;
}

/* Explicitly prevent the last four from becoming narrow strips */
body.resava-cave-page .resava-photo-gallery > :nth-child(10),
body.resava-cave-page .resava-photo-gallery > :nth-child(11),
body.resava-cave-page .resava-photo-gallery > :nth-child(12),
body.resava-cave-page .resava-photo-gallery > :nth-child(13){
  grid-column:span 3 !important;
  grid-row:span 2 !important;
}

body.resava-cave-page .resava-photo-gallery > :nth-child(12){
  grid-column:span 3 !important;
}

body.resava-cave-page .resava-photo-gallery > .resava-gallery-item img,
body.resava-cave-page .resava-photo-gallery > .gallery-item img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-width:100% !important;
  min-height:100% !important;
  object-fit:cover !important;
}

@media(max-width:900px){
  body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-grid{
    grid-template-columns:1fr !important;
  }

  body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-photo,
  body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-photo img{
    height:320px !important;
    min-height:320px !important;
    max-height:320px !important;
  }

  body.resava-cave-page .resava-photo-gallery{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    grid-auto-rows:240px !important;
  }

  body.resava-cave-page .resava-photo-gallery > :nth-child(n){
    grid-column:span 1 !important;
    grid-row:span 1 !important;
  }

  body.resava-cave-page .resava-photo-gallery > :nth-child(1),
  body.resava-cave-page .resava-photo-gallery > :nth-child(4),
  body.resava-cave-page .resava-photo-gallery > :nth-child(13){
    grid-column:span 2 !important;
  }
}

@media(max-width:560px){
  body.resava-cave-page .cave-hero.cave-hero-compact{
    padding:28px 0 !important;
  }

  body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-grid{
    width:calc(100% - 28px) !important;
  }

  body.resava-cave-page .cave-hero.cave-hero-compact h1{
    font-size:2.45rem !important;
  }

  body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-photo,
  body.resava-cave-page .cave-hero.cave-hero-compact .cave-hero-photo img{
    height:245px !important;
    min-height:245px !important;
    max-height:245px !important;
  }

  body.resava-cave-page .resava-photo-gallery{
    grid-template-columns:1fr !important;
    grid-auto-rows:260px !important;
  }

  body.resava-cave-page .resava-photo-gallery > :nth-child(n){
    grid-column:span 1 !important;
    grid-row:span 1 !important;
  }
}