/* Static skin for serverless SEO HTML. The top bar matches the homepage navbar; /seo-nav.js only toggles scroll state and language. */
@font-face {
  font-family: Figtree;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/figtree-500-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: Figtree;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/figtree-500-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: Figtree;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/figtree-600-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: Figtree;
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/figtree-600-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: light;
  --seo-bg: #0b0f13;
  --seo-fg: #f3f4f6;
  --seo-muted: #9ca3af;
  --seo-accent: #34d399;
  --seo-cta: #33cc99;
  --seo-card: rgba(255, 255, 255, 0.05);
  --seo-border: rgba(255, 255, 255, 0.1);
}

* {
  box-sizing: border-box;
}

html {
  background: var(--seo-bg);
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--seo-bg);
  color: var(--seo-fg);
  font-family: system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  position: relative;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(to right, #80808012 1px, transparent 1px),
    linear-gradient(to bottom, #80808012 1px, transparent 1px);
  background-size: 24px 24px;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(28rem 28rem at 88% -8%, rgba(52, 211, 153, 0.12), transparent 70%),
    radial-gradient(34rem 34rem at 0% 48%, rgba(6, 182, 212, 0.1), transparent 70%),
    linear-gradient(to top, #0b0f13, transparent 42%, rgba(11, 15, 19, 0.55));
}

.seo-top,
.seo-main,
.seo-foot {
  position: relative;
  z-index: 1;
}

.seo-chrome {
  font-family: Figtree, system-ui, Avenir, Helvetica, Arial, sans-serif;
}

.seo-top {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  padding: 1rem 0;
  pointer-events: none;
  animation: seo-nav-drop 0.55s cubic-bezier(0.22, 1.2, 0.36, 1) both;
}

@keyframes seo-nav-drop {
  from { transform: translateY(-100px); }
  to { transform: none; }
}

.seo-nav-shell {
  max-width: 72rem;
  margin: 0 auto;
  padding: 0 1rem;
  transition: max-width 300ms;
}

.seo-top.is-scrolled .seo-nav-shell {
  max-width: 64rem;
}

.seo-nav {
  pointer-events: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: nowrap;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 999px;
  padding: 0.75rem 1.25rem;
  box-shadow: none;
  backdrop-filter: blur(0);
  -webkit-backdrop-filter: blur(0);
  transition: border-color 300ms, background-color 300ms, box-shadow 300ms, backdrop-filter 300ms, -webkit-backdrop-filter 300ms;
  transition-delay: 350ms;
}

.seo-top.is-scrolled .seo-nav {
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.05);
  box-shadow: 0 10px 40px rgba(15, 122, 113, 0.25);
  backdrop-filter: blur(40px);
  -webkit-backdrop-filter: blur(40px);
  transition-delay: 0ms;
}

.seo-brand,
.seo-nav-logo {
  position: relative;
  display: inline-block;
  width: 9.5rem;
  height: 2rem;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20id%3D%22Layer_2%22%20data-name%3D%22Layer%202%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20511.11%20173.74%22%3E%20%3Cdefs%3E%20%3Cstyle%3E%20.cls-1%20%7B%20fill%3A%20url(%23linear-gradient-2)%3B%20%7D%20.cls-2%2C%20.cls-3%20%7B%20fill%3A%20%23fff%3B%20%7D%20.cls-3%20%7B%20opacity%3A%200%3B%20%7D%20.cls-4%20%7B%20fill%3A%20url(%23linear-gradient)%3B%20%7D%20%3C%2Fstyle%3E%20%3ClinearGradient%20id%3D%22linear-gradient%22%20x1%3D%220%22%20y1%3D%2258.38%22%20x2%3D%22118.07%22%20y2%3D%2258.38%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%20%3Cstop%20offset%3D%220%22%20stop-color%3D%22%233c9%22%2F%3E%20%3Cstop%20offset%3D%22.14%22%20stop-color%3D%22%233c9%22%2F%3E%20%3Cstop%20offset%3D%221%22%20stop-color%3D%22%233c9%22%2F%3E%20%3C%2FlinearGradient%3E%20%3ClinearGradient%20id%3D%22linear-gradient-2%22%20x1%3D%2237.15%22%20y1%3D%22152.67%22%20x2%3D%2279.3%22%20y2%3D%22152.67%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%20%3Cstop%20offset%3D%220%22%20stop-color%3D%22%233c9%22%2F%3E%20%3Cstop%20offset%3D%221%22%20stop-color%3D%22%233c9%22%2F%3E%20%3C%2FlinearGradient%3E%20%3C%2Fdefs%3E%20%3Cg%20id%3D%22Layer_1-2%22%20data-name%3D%22Layer%201%22%3E%20%3Cg%20id%3D%22Layer_2-2%22%20data-name%3D%22Layer%202%22%3E%20%3Cg%3E%20%3Cg%20id%3D%22Gigron%22%3E%20%3Cg%20id%3D%22main_circle%22%20data-name%3D%22main%20circle%22%3E%20%3Cpath%20class%3D%22cls-2%22%20d%3D%22M327.23%2C119.31c-3.84%2C0-7.56-.75-11.07-2.24-3.39-1.43-6.43-3.48-9.04-6.09-2.61-2.61-4.66-5.65-6.09-9.04-1.49-3.51-2.24-7.24-2.24-11.07s.75-7.56%2C2.24-11.07c1.43-3.39%2C3.48-6.43%2C6.09-9.04%2C2.61-2.61%2C5.65-4.66%2C9.04-6.09%2C3.51-1.49%2C7.24-2.24%2C11.07-2.24s7.56.75%2C11.07%2C2.24c3.39%2C1.43%2C14.76-3.38%2C17.37-.77%2C2.61%2C2.61-3.67%2C12.51-2.24%2C15.9%2C1.49%2C3.51%2C2.24%2C7.24%2C2.24%2C11.07s-.75%2C7.56-2.24%2C11.07c-1.43%2C3.39-3.48%2C6.43-6.09%2C9.04-2.61%2C2.61-5.65%2C4.66-9.04%2C6.09-3.51%2C1.49-7.24%2C2.24-11.07%2C2.24ZM327.23%2C80.81c-5.55%2C0-10.06%2C4.51-10.06%2C10.06s4.51%2C10.06%2C10.06%2C10.06%2C10.06-4.51%2C10.06-10.06-4.51-10.06-10.06-10.06Z%22%2F%3E%20%3C%2Fg%3E%20%3Ccircle%20class%3D%22cls-2%22%20cx%3D%22327.29%22%20cy%3D%22137.06%22%20r%3D%229.8%22%2F%3E%20%3Cg%3E%20%3Cpath%20class%3D%22cls-2%22%20d%3D%22M234.08%2C101.43c5.75%2C0%2C9.91-.85%2C12.46-2.56s4.01-3.98%2C4.37-6.82h-22.9v-14.91h41.01v40.26h-18.11v-11.5h-.96v1.06c0%2C1.49-.48%2C2.93-1.44%2C4.31-.96%2C1.38-2.31%2C2.61-4.05%2C3.67-1.74%2C1.07-3.85%2C1.92-6.34%2C2.56-2.49.64-5.26.96-8.31.96-5.33%2C0-10.19-.87-14.59-2.61-4.4-1.74-8.18-4.24-11.34-7.51-3.16-3.26-5.61-7.19-7.35-11.77-1.74-4.58-2.61-9.67-2.61-15.28%2C0-6.03.92-11.48%2C2.77-16.35%2C1.85-4.86%2C4.47-9.02%2C7.88-12.46%2C3.41-3.44%2C7.49-6.09%2C12.25-7.94%2C4.76-1.85%2C10.05-2.77%2C15.87-2.77%2C4.83%2C0%2C9.28.66%2C13.37%2C1.97%2C4.08%2C1.31%2C7.7%2C3.16%2C10.86%2C5.54%2C3.16%2C2.38%2C5.79%2C5.22%2C7.88%2C8.52%2C2.09%2C3.3%2C3.5%2C6.98%2C4.21%2C11.02h-19.38c-1.7-3.2-3.92-5.66-6.66-7.4-2.73-1.74-6.16-2.61-10.28-2.61-3.05%2C0-5.86.52-8.41%2C1.54-2.56%2C1.03-4.74%2C2.47-6.55%2C4.31-1.81%2C1.85-3.21%2C4.08-4.21%2C6.71-1%2C2.63-1.49%2C5.54-1.49%2C8.73%2C0%2C6.39%2C1.85%2C11.54%2C5.54%2C15.44%2C3.69%2C3.91%2C9.19%2C5.86%2C16.51%2C5.86Z%22%2F%3E%20%3Cpath%20class%3D%22cls-2%22%20d%3D%22M275.08%2C50.73c0-2.7.92-4.88%2C2.77-6.55%2C1.85-1.67%2C4.29-2.5%2C7.35-2.5s5.5.84%2C7.35%2C2.5c1.85%2C1.67%2C2.77%2C3.85%2C2.77%2C6.55s-.92%2C4.88-2.77%2C6.55c-1.85%2C1.67-4.3%2C2.5-7.35%2C2.5s-5.5-.83-7.35-2.5c-1.85-1.67-2.77-3.85-2.77-6.55ZM276.15%2C64.15h18.11v53.25h-18.11v-53.25Z%22%2F%3E%20%3Cpath%20class%3D%22cls-2%22%20d%3D%22M379.04%2C117.4h-18.11v-22.05c0-5.18.69-9.73%2C2.08-13.63%2C1.38-3.9%2C3.37-7.15%2C5.96-9.75%2C2.59-2.59%2C5.7-4.54%2C9.32-5.86%2C3.62-1.31%2C7.67-1.97%2C12.14-1.97v18.11c-3.41%2C0-6.16.89-8.25%2C2.66-2.1%2C1.78-3.14%2C4.44-3.14%2C7.99v24.5Z%22%2F%3E%20%3Cpath%20class%3D%22cls-2%22%20d%3D%22M394.91%2C90.77c0-4.19.67-7.97%2C2.02-11.34%2C1.35-3.37%2C3.25-6.28%2C5.7-8.73%2C2.45-2.45%2C5.4-4.33%2C8.84-5.64%2C3.44-1.31%2C7.26-1.97%2C11.45-1.97s8.01.66%2C11.45%2C1.97c3.44%2C1.31%2C6.39%2C3.2%2C8.84%2C5.64%2C2.45%2C2.45%2C4.35%2C5.36%2C5.7%2C8.73%2C1.35%2C3.37%2C2.02%2C7.15%2C2.02%2C11.34s-.68%2C7.88-2.02%2C11.29c-1.35%2C3.41-3.25%2C6.34-5.7%2C8.79s-5.4%2C4.33-8.84%2C5.65c-3.44%2C1.31-7.26%2C1.97-11.45%2C1.97s-8.01-.66-11.45-1.97c-3.45-1.31-6.39-3.2-8.84-5.65s-4.35-5.38-5.7-8.79c-1.35-3.41-2.02-7.17-2.02-11.29ZM413.01%2C90.77c0%2C3.2.91%2C5.77%2C2.72%2C7.72%2C1.81%2C1.95%2C4.21%2C2.93%2C7.19%2C2.93s5.38-.98%2C7.19-2.93c1.81-1.95%2C2.72-4.53%2C2.72-7.72s-.91-5.77-2.72-7.72c-1.81-1.95-4.21-2.93-7.19-2.93s-5.38.98-7.19%2C2.93c-1.81%2C1.95-2.72%2C4.53-2.72%2C7.72Z%22%2F%3E%20%3Cpath%20class%3D%22cls-2%22%20d%3D%22M475%2C117.4h-18.11v-27.48c0-4.05.64-7.72%2C1.92-11.02s3.12-6.12%2C5.54-8.47c2.41-2.34%2C5.31-4.15%2C8.68-5.43%2C3.37-1.28%2C7.12-1.92%2C11.24-1.92s7.72.64%2C11.02%2C1.92c3.3%2C1.28%2C6.12%2C3.09%2C8.47%2C5.43s4.15%2C5.17%2C5.43%2C8.47%2C1.92%2C6.98%2C1.92%2C11.02v27.48h-18.11v-28.33c0-2.7-.84-4.86-2.5-6.5-1.67-1.63-3.85-2.45-6.55-2.45s-4.86.82-6.5%2C2.45-2.45%2C3.8-2.45%2C6.5v28.33Z%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3Cg%20id%3D%22Logo%22%3E%20%3Cg%20id%3D%22main_circle-2%22%20data-name%3D%22main%20circle%22%3E%20%3Cpath%20class%3D%22cls-4%22%20d%3D%22M58.38%2C116.76c-7.87%2C0-15.52-1.55-22.73-4.6-6.95-2.94-13.2-7.15-18.55-12.5-5.36-5.36-9.56-11.6-12.5-18.55-3.05-7.21-4.6-14.86-4.6-22.73s1.55-15.52%2C4.6-22.73c2.94-6.95%2C7.15-13.2%2C12.5-18.55%2C5.36-5.36%2C11.6-9.56%2C18.55-12.5C42.86%2C1.55%2C50.5%2C0%2C58.38%2C0s15.52%2C1.55%2C22.73%2C4.6c6.95%2C2.94%2C30.29-6.93%2C35.65-1.57%2C5.36%2C5.36-7.54%2C25.67-4.6%2C32.63%2C3.05%2C7.21%2C4.6%2C14.86%2C4.6%2C22.73s-1.55%2C15.52-4.6%2C22.73c-2.94%2C6.95-7.15%2C13.19-12.5%2C18.55-5.36%2C5.36-11.6%2C9.56-18.55%2C12.5-7.21%2C3.05-14.86%2C4.6-22.73%2C4.6ZM58.38%2C37.73c-11.38%2C0-20.64%2C9.26-20.64%2C20.64s9.26%2C20.64%2C20.64%2C20.64%2C20.64-9.26%2C20.64-20.64-9.26-20.64-20.64-20.64Z%22%2F%3E%20%3C%2Fg%3E%20%3Ccircle%20class%3D%22cls-1%22%20cx%3D%2258.22%22%20cy%3D%22152.67%22%20r%3D%2221.07%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E") no-repeat left center / contain;
  color: var(--seo-fg);
  font-weight: 700;
  letter-spacing: 0.02em;
  text-decoration: none;
}

.seo-brand span,
.seo-nav-logo span {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.seo-foot-brand .seo-brand {
  width: 12.5rem;
  height: 2.6rem;
}

.seo-brand:hover,
.seo-brand:focus {
  color: var(--seo-accent);
}

.seo-l-en { display: none; }

html[data-nav-lang="en"] .seo-l-hr { display: none; }

html[data-nav-lang="en"] .seo-l-en { display: inline; }

.seo-nav-logo {
  width: 5.875rem;
  height: 2rem;
  min-width: 0;
  flex-shrink: 1;
  filter: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
}

.seo-nav-logo:hover,
.seo-nav-logo:focus {
  color: inherit;
  text-decoration: none;
}

.seo-nav-links,
.seo-nav-actions {
  display: none;
}

.seo-nav-links {
  align-items: center;
  gap: 1.5rem;
  min-width: 0;
  font-size: 0.875rem;
  font-weight: 500;
}

.seo-nav-links a {
  position: relative;
  padding: 0.25rem 0.5rem;
  color: #fff;
  font-weight: 500;
  text-decoration: none;
  transition: color 150ms;
}

.seo-nav-links a:hover,
.seo-nav-links a:focus {
  color: #fff;
  text-decoration: none;
}

.seo-nav-actions {
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}

.seo-nav-lang {
  display: flex;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 999px;
  padding: 0.25rem;
}

.seo-nav-lang button,
.seo-nav-menu-lang button {
  font-family: inherit;
  cursor: pointer;
}

.seo-nav-lang button {
  border: 0;
  background: transparent;
  border-radius: 999px;
  padding: 0.25rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1rem;
  color: #d1d5db;
  transition: color 150ms, background 150ms;
}

.seo-nav-lang button:hover,
.seo-nav-lang button:focus {
  color: #fff;
}

html:not([data-nav-lang="en"]) .seo-nav-lang button[data-set-lang="hr"],
html[data-nav-lang="hr"] .seo-nav-lang button[data-set-lang="hr"],
html[data-nav-lang="en"] .seo-nav-lang button[data-set-lang="en"] {
  background: linear-gradient(to right, rgba(52, 211, 153, 0.9), #34d399);
  color: #000;
}

.seo-top.is-scrolled .seo-nav-actions .seo-nav-lang {
  display: none;
}

.seo-nav-cta {
  position: relative;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: #33cc99;
  color: #fff !important;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  padding: 0.625rem 1.25rem;
  text-decoration: none;
  box-shadow: 0 10px 15px -3px rgb(6 78 59 / 0.2), 0 4px 6px -4px rgb(6 78 59 / 0.2);
  transition: transform 300ms, box-shadow 300ms;
}

.seo-nav-cta:hover,
.seo-nav-cta:focus {
  color: #fff !important;
  text-decoration: none;
  transform: translateY(-2px);
  box-shadow: 0 10px 15px -3px rgb(52 211 153 / 0.4), 0 4px 6px -4px rgb(52 211 153 / 0.4);
}

.seo-nav-cta-shine {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.2);
  transform: translateY(100%);
  transition: transform 300ms;
}

.seo-nav-cta:hover .seo-nav-cta-shine,
.seo-nav-cta:focus .seo-nav-cta-shine {
  transform: translateY(0);
}

.seo-nav-cta-label {
  position: relative;
  z-index: 1;
}

.seo-nav-check {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.seo-nav-check:focus-visible + .seo-nav-toggle {
  outline: 2px solid #34d399;
  outline-offset: 2px;
}

.seo-nav-toggle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-shrink: 0;
  padding: 0.5rem;
  color: #fff;
  border-radius: 0.5rem;
  cursor: pointer;
}

.seo-nav-toggle span {
  display: block;
  width: 1.5rem;
  height: 0.125rem;
  background: currentColor;
  margin-bottom: 0.375rem;
  transform-origin: center;
  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.seo-nav-toggle span:last-child {
  margin-bottom: 0;
}

.seo-chrome:has(.seo-nav-check:checked) .seo-nav-toggle span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}

.seo-chrome:has(.seo-nav-check:checked) .seo-nav-toggle span:nth-child(2) {
  opacity: 0;
}

.seo-chrome:has(.seo-nav-check:checked) .seo-nav-toggle span:nth-child(3) {
  transform: rotate(-45deg) translate(6px, -6px);
}

.seo-nav-menu {
  position: fixed;
  top: 5rem;
  left: 0;
  right: 0;
  z-index: 40;
  padding: 0 1rem;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: opacity 200ms ease, transform 200ms ease, visibility 200ms;
}

.seo-chrome:has(.seo-nav-check:checked) .seo-nav-menu {
  pointer-events: auto;
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.seo-nav-menu-panel {
  max-width: 72rem;
  margin: 0 auto;
  border-radius: 1.5rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(7, 9, 13, 0.95);
  backdrop-filter: blur(40px);
  -webkit-backdrop-filter: blur(40px);
  box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  padding: 1.5rem;
  display: grid;
  gap: 1rem;
}

.seo-nav-menu nav {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.seo-nav-menu nav a {
  color: #fff;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.75rem;
  text-decoration: none;
  padding: 0.5rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.seo-nav-menu nav a:hover,
.seo-nav-menu nav a:focus {
  color: #fff;
  text-decoration: none;
}

.seo-nav-menu-lang {
  display: flex;
  gap: 0.75rem;
}

.seo-nav-menu-lang button {
  flex: 1;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: transparent;
  color: #d1d5db;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  transition: color 150ms, background 150ms, border-color 150ms;
}

html:not([data-nav-lang="en"]) .seo-nav-menu-lang button[data-set-lang="hr"],
html[data-nav-lang="hr"] .seo-nav-menu-lang button[data-set-lang="hr"],
html[data-nav-lang="en"] .seo-nav-menu-lang button[data-set-lang="en"] {
  border-color: rgba(52, 211, 153, 0.8);
  color: #34d399;
  background: rgba(52, 211, 153, 0.1);
}

.seo-nav-menu-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  border-radius: 999px;
  background: #33cc99;
  color: #fff !important;
  padding: 0.75rem 1.25rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
}

.seo-nav-menu-cta:hover,
.seo-nav-menu-cta:focus {
  color: #fff !important;
  text-decoration: none;
}

@media (min-width: 768px) {
  .seo-nav-links,
  .seo-nav-actions {
    display: flex;
  }

  .seo-nav-toggle,
  .seo-nav-check,
  .seo-nav-menu {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .seo-top {
    animation: none;
  }

  .seo-nav,
  .seo-nav-shell,
  .seo-nav-menu,
  .seo-nav-cta,
  .seo-nav-cta-shine,
  .seo-nav-toggle span {
    transition: none;
  }
}

.seo-main {
  max-width: 56rem;
  margin: 0 auto;
  padding: 8.75rem 1.25rem 4rem;
}

.seo-main h1 {
  margin: 0 0 1rem;
  font-size: clamp(1.85rem, 4vw, 3rem);
  font-weight: 700;
  line-height: 1.15;
  background: linear-gradient(to right, #ffffff, #e5e7eb, #9ca3af);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.seo-main > h2 {
  margin: 2rem 0 1rem;
  font-size: 1.15rem;
  font-weight: 600;
  color: #fff;
}

.seo-main > p {
  margin: 0 0 1.25rem;
  color: var(--seo-muted);
  font-size: 1.05rem;
}

a {
  color: var(--seo-accent);
  text-decoration: none;
}

a:hover,
a:focus {
  text-decoration: underline;
}

.seo-cards {
  list-style: none;
  margin: 0 0 2rem;
  padding: 0;
  display: grid;
  gap: 0.85rem;
}

.seo-worker,
.seo-cards > li {
  background: var(--seo-card);
  border: 1px solid var(--seo-border);
  border-radius: 1.15rem;
  padding: 1rem 1.1rem;
}

.seo-worker > a,
.seo-cards > li > a {
  color: var(--seo-fg);
  font-weight: 600;
  font-size: 1.02rem;
}

.seo-worker > a:hover,
.seo-worker > a:focus,
.seo-cards > li > a:hover,
.seo-cards > li > a:focus {
  color: var(--seo-accent);
  text-decoration: none;
}

.seo-reviews {
  margin: 0.75rem 0 0;
  display: grid;
  gap: 0.55rem;
}

.seo-review {
  margin: 0;
  padding: 0.7rem 0.85rem;
  border-left: 2px solid var(--seo-accent);
  background: rgba(0, 0, 0, 0.22);
  border-radius: 0 0.75rem 0.75rem 0;
  color: #d1d5db;
  font-size: 0.94rem;
}

.seo-quote-cta {
  display: inline-flex;
  margin-top: 0.85rem;
  padding: 0.55rem 0.95rem;
  border-radius: 999px;
  background: var(--seo-cta);
  color: #042f2e;
  font-weight: 700;
  font-size: 0.88rem;
  text-decoration: none;
}

.seo-quote-cta:hover,
.seo-quote-cta:focus {
  color: #042f2e;
  filter: brightness(1.06);
  text-decoration: none;
}

.seo-profile-meta,
.seo-profile-bio {
  color: var(--seo-muted);
}

.seo-profile-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
}

.seo-profile-cats li {
  border: 1px solid var(--seo-border);
  background: var(--seo-card);
  border-radius: 999px;
  padding: 0.28rem 0.7rem;
  font-size: 0.85rem;
  color: var(--seo-fg);
}

.seo-main > p:last-child {
  padding-top: 1rem;
  border-top: 1px solid var(--seo-border);
}

.seo-crumbs {
  margin: 0 0 1.25rem;
  font-size: 0.92rem;
  color: var(--seo-muted);
}

.seo-crumbs a {
  color: var(--seo-muted);
}

.seo-crumbs a:hover,
.seo-crumbs a:focus {
  color: var(--seo-accent);
}

.seo-crumbs [aria-current="page"] {
  color: var(--seo-fg);
}

.seo-demand {
  color: var(--seo-muted);
}

.seo-discovery {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--seo-border);
}

.seo-discovery h2 {
  margin: 0 0 1rem;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--seo-muted);
}

.seo-discovery ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1.15rem;
}

.seo-discovery li {
  background: transparent;
  border: 0;
  padding: 0;
  border-radius: 0;
}

.seo-foot {
  margin-top: auto;
  padding: 3.5rem 1.25rem 2rem;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.seo-foot-grid {
  max-width: 72rem;
  margin: 0 auto 2.5rem;
  display: grid;
  gap: 2rem;
  grid-template-columns: 1fr;
}

@media (min-width: 720px) {
  .seo-foot-grid {
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
  }
}

.seo-foot-brand p {
  margin: 0.85rem 0 0;
  color: var(--seo-muted);
  max-width: 18rem;
  font-size: 0.92rem;
}

.seo-foot h2 {
  margin: 0 0 0.85rem;
  font-size: 0.88rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #fff;
}

.seo-foot ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}

.seo-foot li {
  background: transparent;
  border: 0;
  padding: 0;
}

.seo-foot a {
  color: var(--seo-muted);
  font-size: 0.92rem;
}

.seo-foot a:hover,
.seo-foot a:focus {
  color: var(--seo-accent);
  text-decoration: none;
}

.seo-foot-copy {
  max-width: 72rem;
  margin: 0 auto;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  color: #6b7280;
  font-size: 0.88rem;
}

/* Live /u/{username} public-profile twin. Scoped so hub/pair SEO pages stay unchanged. */
body.seo-pp {
  font-family: "Figtree", system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
}

body.seo-pp a:hover,
body.seo-pp a:focus {
  text-decoration: none;
}

body.seo-pp .seo-pp-top {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  padding: 1rem 1rem 0;
}

body.seo-pp .seo-pp-nav {
  max-width: 72rem;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border: 1px solid var(--seo-border);
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(24px);
  border-radius: 999px;
  padding: 0.75rem 1.25rem;
  box-shadow: 0 10px 40px rgba(15, 122, 113, 0.25);
}

body.seo-pp .seo-pp-nav .seo-brand {
  width: 7.5rem;
  height: 2rem;
  flex-shrink: 0;
}

body.seo-pp .seo-pp-links {
  display: none;
  align-items: center;
  gap: 1.5rem;
  font-size: 0.875rem;
  font-weight: 500;
}

body.seo-pp .seo-pp-links a {
  color: #d1d5db;
  text-decoration: none;
}

body.seo-pp .seo-pp-links a:hover,
body.seo-pp .seo-pp-links a:focus {
  color: #fff;
}

body.seo-pp .seo-pp-actions {
  display: none;
  align-items: center;
  gap: 0.75rem;
}

body.seo-pp .seo-pp-lang {
  display: flex;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--seo-border);
  border-radius: 999px;
  padding: 0.2rem;
}

body.seo-pp .seo-pp-lang a {
  padding: 0.25rem 0.75rem;
  font-size: 0.7rem;
  font-weight: 600;
  border-radius: 999px;
  color: #d1d5db;
  text-decoration: none;
}

body.seo-pp .seo-pp-lang a.is-active {
  background: linear-gradient(to right, rgba(52, 211, 153, 0.9), #34d399);
  color: #000;
}

body.seo-pp .seo-pp-getapp {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: #33cc99;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  padding: 0.6rem 1.25rem;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(16, 185, 129, 0.18);
}

body.seo-pp .seo-pp-menu {
  display: block;
}

body.seo-pp .seo-pp-menu summary {
  list-style: none;
  cursor: pointer;
  color: #fff;
  padding: 0.5rem;
}

body.seo-pp .seo-pp-menu summary::-webkit-details-marker {
  display: none;
}

body.seo-pp .seo-pp-burger {
  display: block;
  width: 1.35rem;
  height: 0.12rem;
  background: currentColor;
  margin: 0.28rem 0;
  border-radius: 99px;
}

body.seo-pp .seo-pp-menu-panel {
  position: absolute;
  left: 1rem;
  right: 1rem;
  top: 4.6rem;
  border: 1px solid var(--seo-border);
  background: rgba(7, 9, 13, 0.95);
  backdrop-filter: blur(24px);
  border-radius: 1.5rem;
  padding: 1.25rem;
  display: grid;
  gap: 0.65rem;
}

body.seo-pp .seo-pp-menu-panel a {
  color: #f3f4f6;
  text-decoration: none;
  font-weight: 500;
  padding: 0.45rem 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

body.seo-pp .seo-main {
  max-width: 64rem;
  width: 100%;
  margin: 0 auto;
  padding: 6.5rem 1rem 5rem;
}

body.seo-pp .seo-main h1 {
  background: none;
  -webkit-background-clip: unset;
  background-clip: unset;
  color: #fff;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  margin: 0;
}

body.seo-pp .seo-main > p:last-child {
  padding-top: 0;
  border-top: 0;
}

body.seo-pp .seo-pp-stack {
  display: grid;
  gap: 1.5rem;
}

body.seo-pp .seo-pp-card {
  position: relative;
  overflow: hidden;
  border-radius: 1.5rem;
  background: rgba(26, 31, 38, 0.8);
  border: 1px solid var(--seo-border);
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.35);
}

body.seo-pp .seo-pp-cover {
  height: 12rem;
  position: relative;
  overflow: hidden;
  background: linear-gradient(to right, rgba(6, 78, 59, 0.4), #0b0f13, rgba(22, 78, 99, 0.4));
}

body.seo-pp .seo-pp-cover::before,
body.seo-pp .seo-pp-cover::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  filter: blur(60px);
}

body.seo-pp .seo-pp-cover::before {
  width: 24rem;
  height: 24rem;
  right: -6rem;
  top: -6rem;
  background: rgba(52, 211, 153, 0.3);
}

body.seo-pp .seo-pp-cover::after {
  width: 16rem;
  height: 16rem;
  left: 0;
  top: 50%;
  background: rgba(6, 182, 212, 0.2);
}

body.seo-pp .seo-pp-head {
  padding: 0 1.5rem 2rem;
  position: relative;
}

body.seo-pp .seo-pp-actions-row {
  display: none;
  position: absolute;
  top: 1rem;
  right: 1.5rem;
  gap: 0.75rem;
  z-index: 2;
}

body.seo-pp .seo-pp-chip-btn,
body.seo-pp .seo-pp-openapp {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border-radius: 999px;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
}

body.seo-pp .seo-pp-chip-btn {
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid var(--seo-border);
  color: #fff;
}

body.seo-pp .seo-pp-chip-btn .seo-pp-ico,
body.seo-pp .seo-pp-pro .seo-pp-ico,
body.seo-pp .seo-pp-addr .seo-pp-ico {
  width: 1.05rem;
  height: 1.05rem;
  flex-shrink: 0;
}

body.seo-pp .seo-pp-pro .seo-pp-ico {
  color: #34d399;
}

body.seo-pp .seo-pp-addr {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

body.seo-pp .seo-pp-addr .seo-pp-ico {
  color: #6b7280;
}

body.seo-pp .seo-pp-openapp {
  background: rgba(52, 211, 153, 0.7);
  color: #000;
}

body.seo-pp .seo-pp-openapp:hover,
body.seo-pp .seo-pp-openapp:focus {
  background: rgba(52, 211, 153, 0.8);
}

body.seo-pp .seo-pp-identity {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: -4rem;
  align-items: center;
  text-align: center;
}

body.seo-pp .seo-pp-avatar-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
}

body.seo-pp .seo-pp-avatar-wrap {
  position: relative;
  width: 8rem;
  height: 8rem;
  border-radius: 999px;
  padding: 0.35rem;
  background: #1a1f26;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4);
  flex-shrink: 0;
}

body.seo-pp .seo-pp-avatar-wrap img,
body.seo-pp .seo-pp-avatar-fallback {
  width: 100%;
  height: 100%;
  border-radius: 999px;
  object-fit: cover;
  background: #1f2937;
}

body.seo-pp .seo-pp-avatar-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.25rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.2);
}

body.seo-pp .seo-pp-pro {
  position: absolute;
  right: 0.4rem;
  bottom: 0.4rem;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: #0b0f13;
  border: 1px solid rgba(52, 211, 153, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #34d399;
  font-size: 0.85rem;
}

body.seo-pp .seo-pp-stars {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin-top: 0.65rem;
}

body.seo-pp .seo-pp-stars svg {
  width: 1.1rem;
  height: 1.1rem;
}

body.seo-pp .seo-pp-star-on {
  fill: #34d399;
}

body.seo-pp .seo-pp-star-off {
  fill: #4b5563;
}

body.seo-pp .seo-pp-rating-n {
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  margin-left: 0.15rem;
}

body.seo-pp .seo-pp-rating-c {
  color: #9ca3af;
  font-size: 0.75rem;
}

body.seo-pp .seo-pp-copy {
  flex: 1;
}

body.seo-pp .seo-pp-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 0.5rem;
  font-size: 0.875rem;
  color: #9ca3af;
}

body.seo-pp .seo-pp-role {
  padding: 0.1rem 0.5rem;
  border-radius: 0.25rem;
  border: 1px solid rgba(52, 211, 153, 0.2);
  background: rgba(52, 211, 153, 0.1);
  color: #34d399;
}

body.seo-pp .seo-pp-bio {
  margin: 1rem 0 0;
  max-width: 42rem;
  color: #d1d5db;
  font-size: 0.875rem;
  line-height: 1.6;
  white-space: pre-wrap;
}

body.seo-pp .seo-pp-bio-wrap .seo-pp-bio {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

body.seo-pp .seo-pp-bio-wrap input:checked ~ .seo-pp-bio {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
}

body.seo-pp .seo-pp-bio-toggle {
  display: inline-block;
  margin-top: 0.25rem;
  color: rgba(52, 211, 153, 0.7);
  font-size: 0.75rem;
  font-weight: 500;
  cursor: pointer;
}

body.seo-pp .seo-pp-bio-toggle:hover,
body.seo-pp .seo-pp-bio-toggle:focus {
  color: #34d399;
}

body.seo-pp .seo-pp-bio-wrap input:checked ~ .seo-pp-bio-toggle .is-more,
body.seo-pp .seo-pp-bio-wrap input:not(:checked) ~ .seo-pp-bio-toggle .is-less {
  display: none;
}

body.seo-pp .seo-pp-mobile-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding-top: 0.75rem;
}

body.seo-pp .seo-pp-mobile-actions .seo-pp-chip-btn {
  width: 2.75rem;
  height: 2.75rem;
  padding: 0;
  justify-content: center;
}

body.seo-pp .seo-pp-mobile-actions .seo-pp-openapp {
  flex: 1;
  max-width: 20rem;
  justify-content: center;
}

body.seo-pp .seo-pp-stats-m {
  display: flex;
  gap: 1rem;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

body.seo-pp .seo-pp-stat {
  flex: 1;
  text-align: center;
  padding: 0.75rem;
  border-radius: 0.75rem;
  background: rgba(255, 255, 255, 0.05);
}

body.seo-pp .seo-pp-stat b {
  display: block;
  color: #fff;
  font-size: 1.25rem;
}

body.seo-pp .seo-pp-stat span {
  color: #6b7280;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

body.seo-pp .seo-pp-stats-d {
  display: none;
}

body.seo-pp .seo-pp-grid {
  display: grid;
  gap: 1.5rem;
}

body.seo-pp .seo-pp-col {
  display: grid;
  gap: 1.5rem;
}

body.seo-pp .seo-pp-panel {
  border-radius: 1.5rem;
  background: rgba(26, 31, 38, 0.8);
  border: 1px solid var(--seo-border);
  padding: 1.5rem;
}

body.seo-pp .seo-pp-panel h2,
body.seo-pp .seo-pp-map-h h2 {
  margin: 0 0 1.25rem;
  color: #fff;
  font-size: 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

body.seo-pp .seo-pp-projects {
  display: grid;
  gap: 1rem;
}

body.seo-pp .seo-pp-project {
  overflow: hidden;
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.05);
  background: rgba(0, 0, 0, 0.2);
  text-decoration: none;
  color: inherit;
}

body.seo-pp .seo-pp-project img,
body.seo-pp .seo-pp-project-ph {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: #1f2937;
}

body.seo-pp .seo-pp-project-ph {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #4b5563;
}

body.seo-pp .seo-pp-project div {
  padding: 1rem;
  background: #15191e;
}

body.seo-pp .seo-pp-project strong {
  display: block;
  color: #e5e7eb;
  font-size: 0.95rem;
}

body.seo-pp .seo-pp-project p {
  margin: 0.35rem 0 0;
  color: #6b7280;
  font-size: 0.75rem;
}

body.seo-pp .seo-pp-map {
  overflow: hidden;
  padding: 0;
}

body.seo-pp .seo-pp-map-h {
  padding: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

body.seo-pp .seo-pp-map-h h2 {
  margin: 0;
  font-size: 0.875rem;
}

body.seo-pp .seo-pp-map-h span {
  color: rgba(52, 211, 153, 0.7);
  font-size: 0.75rem;
}

body.seo-pp #seo-pp-map {
  height: 18rem;
  width: 100%;
  background: #111827;
  z-index: 0;
}

body.seo-pp .leaflet-container {
  background: #111827;
  font: inherit;
}

body.seo-pp .leaflet-control-attribution {
  background: rgba(11, 15, 19, 0.72);
  color: #9ca3af;
}

body.seo-pp .seo-profile-cats {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.5rem;
  margin: 0;
}

body.seo-pp .seo-profile-cats > li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  width: auto;
  max-width: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
}

body.seo-pp .seo-profile-cats > li:has(details[open]) {
  width: 100%;
}

body.seo-pp .seo-pp-cat {
  display: inline-flex;
  align-items: center;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  background: rgba(52, 211, 153, 0.1);
  border: 1px solid rgba(52, 211, 153, 0.2);
  color: #34d399;
  font-size: 0.875rem;
  font-weight: 500;
}

body.seo-pp .seo-pp-cat-static {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #d1d5db;
}

body.seo-pp .seo-pp-cat-more {
  max-width: 100%;
}

body.seo-pp .seo-pp-cat-more[open] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
}

body.seo-pp .seo-pp-cat-more > summary {
  list-style: none;
  cursor: pointer;
}

body.seo-pp .seo-pp-cat-more > summary::-webkit-details-marker {
  display: none;
}

body.seo-pp .seo-pp-cat-mark {
  margin-left: 0.5rem;
  font-size: 0.75rem;
  opacity: 0.6;
}

body.seo-pp .seo-pp-cat-mark::before {
  content: "+";
}

body.seo-pp .seo-pp-cat-more[open] .seo-pp-cat-mark::before {
  content: "−";
}

body.seo-pp .seo-pp-subs {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0 0 0 0.5rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  width: 100%;
  flex-basis: 100%;
}

body.seo-pp .seo-pp-subs li {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.05);
  color: #9ca3af;
  font-size: 0.75rem;
  border-radius: 0.4rem;
  padding: 0.25rem 0.5rem;
}

body.seo-pp .seo-pp-cta {
  text-align: center;
  background: linear-gradient(to bottom right, rgba(52, 211, 153, 0.2), rgba(22, 78, 99, 0.2));
}

body.seo-pp .seo-pp-cta-icon {
  width: 3rem;
  height: 3rem;
  margin: 0 auto 1rem;
  border-radius: 0.75rem;
  background: linear-gradient(to bottom right, #34d399, #06b6d4);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.35rem;
}

body.seo-pp .seo-pp-cta h2 {
  justify-content: center;
  margin-bottom: 0.5rem;
  font-size: 1.1rem;
}

body.seo-pp .seo-pp-cta p {
  color: #9ca3af;
  font-size: 0.75rem;
  margin: 0 0 1.25rem;
}

body.seo-pp .seo-pp-store {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.6rem;
  border-radius: 0.75rem;
  border: 1px solid var(--seo-border);
  background: rgba(255, 255, 255, 0.05);
  color: #e5e7eb;
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 0.65rem;
}

body.seo-pp .seo-pp-store:hover,
body.seo-pp .seo-pp-store:focus {
  background: rgba(255, 255, 255, 0.1);
}

body.seo-pp .seo-pp-cta .seo-quote-cta {
  display: flex;
  width: 100%;
  justify-content: center;
  margin-top: 0.25rem;
}

body.seo-pp .seo-pp-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

body.seo-pp .seo-pp-foot {
  margin-top: auto;
  padding: 5rem 1rem 2.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  position: relative;
}

body.seo-pp .seo-pp-foot-inner {
  max-width: 80rem;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

body.seo-pp .seo-pp-foot-grid {
  display: grid;
  gap: 1.5rem 2.5rem;
  margin-bottom: 4rem;
}

body.seo-pp .seo-pp-brand .seo-brand {
  width: 12.5rem;
  height: 2.6rem;
}

body.seo-pp .seo-pp-brand p {
  margin: 0.75rem 0 0;
  color: #9ca3af;
  font-size: 0.875rem;
  line-height: 1.6;
  max-width: 20rem;
}

body.seo-pp .seo-pp-legal a {
  color: #9ca3af;
}

body.seo-pp .seo-pp-legal a:hover,
body.seo-pp .seo-pp-legal a:focus {
  color: #34d399;
}

body.seo-pp .seo-pp-legal {
  font-style: normal;
  color: #6b7280;
  font-size: 0.875rem;
  line-height: 1.55;
  max-width: 20rem;
}

body.seo-pp .seo-pp-legal p {
  margin: 0 0 0.2rem;
}

body.seo-pp .seo-pp-legal .seo-pp-co {
  color: #d1d5db;
  font-weight: 500;
}

body.seo-pp .seo-pp-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

body.seo-pp .seo-pp-cols h2 {
  margin: 0 0 1rem;
  color: #fff;
  font-size: 0.875rem;
}

body.seo-pp .seo-pp-cols ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.7rem;
}

body.seo-pp .seo-pp-cols a {
  color: #9ca3af;
  font-size: 0.875rem;
  text-decoration: none;
}

body.seo-pp .seo-pp-cols a:hover,
body.seo-pp .seo-pp-cols a:focus {
  color: #34d399;
}

body.seo-pp .seo-pp-hubs {
  margin-bottom: 4rem;
}

body.seo-pp .seo-pp-hubs h2 {
  margin: 0 0 1rem;
  color: #fff;
  font-size: 0.875rem;
}

body.seo-pp .seo-pp-hubs ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
}

body.seo-pp .seo-pp-hubs a {
  color: #9ca3af;
  font-size: 0.875rem;
  text-decoration: none;
}

body.seo-pp .seo-pp-hubs a:hover,
body.seo-pp .seo-pp-hubs a:focus {
  color: #34d399;
}

body.seo-pp .seo-pp-bottom {
  padding-top: 2rem;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
}

body.seo-pp .seo-pp-copyr {
  color: #6b7280;
  font-size: 0.875rem;
  order: 2;
  text-align: center;
}

body.seo-pp .seo-pp-social {
  display: flex;
  gap: 0.75rem;
  order: 1;
}

body.seo-pp .seo-pp-social a {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.05);
  background: rgba(255, 255, 255, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9ca3af;
}

body.seo-pp .seo-pp-social svg {
  width: 1.15rem;
  height: 1.15rem;
  fill: currentColor;
}

@media (min-width: 768px) {
  body.seo-pp .seo-pp-cover {
    height: 16rem;
  }

  body.seo-pp .seo-pp-links,
  body.seo-pp .seo-pp-actions {
    display: flex;
  }

  body.seo-pp .seo-pp-menu {
    display: none;
  }

  body.seo-pp .seo-pp-head {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }

  body.seo-pp .seo-pp-actions-row {
    display: flex;
  }

  body.seo-pp .seo-pp-identity {
    flex-direction: row;
    align-items: flex-start;
    text-align: left;
    margin-top: -5rem;
  }

  body.seo-pp .seo-pp-avatar-wrap {
    width: 11rem;
    height: 11rem;
  }

  body.seo-pp .seo-pp-copy {
    padding-top: 5rem;
  }

  body.seo-pp .seo-pp-meta {
    justify-content: flex-start;
  }

  body.seo-pp .seo-pp-mobile-actions {
    display: none;
  }

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

  body.seo-pp #seo-pp-map {
    height: 24rem;
  }

  body.seo-pp .seo-pp-foot-grid {
    grid-template-columns: repeat(12, 1fr);
  }

  body.seo-pp .seo-pp-brand {
    grid-column: span 5;
  }

  body.seo-pp .seo-pp-legal {
    grid-column: span 5;
    grid-row: 2;
  }

  body.seo-pp .seo-pp-cols {
    grid-column: 6 / span 7;
    grid-row: 2;
    grid-template-columns: 1fr 1fr 1fr;
  }

  body.seo-pp .seo-pp-bottom {
    flex-direction: row;
    justify-content: space-between;
  }

  body.seo-pp .seo-pp-copyr {
    order: 1;
    text-align: left;
  }

  body.seo-pp .seo-pp-social {
    order: 2;
  }
}

@media (min-width: 1024px) {
  body.seo-pp .seo-pp-stats-m {
    display: none;
  }

  body.seo-pp .seo-pp-stats-d {
    display: flex;
    gap: 1rem;
    padding-top: 7.5rem;
  }

  body.seo-pp .seo-pp-stat {
    min-width: 6.25rem;
    border-radius: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.05);
  }

  body.seo-pp .seo-pp-stat b {
    font-size: 1.5rem;
  }

  body.seo-pp .seo-pp-grid {
    grid-template-columns: 2fr 1fr;
    align-items: start;
  }
}

.seo-blog-meta,
.seo-blog-byline {
  color: var(--seo-muted);
  margin: 0 0 1.25rem;
}

.seo-article {
  max-width: 42rem;
}

.seo-article h2,
.seo-article h3 {
  margin: 1.75rem 0 0.75rem;
  color: #fff;
  font-weight: 600;
  line-height: 1.3;
}

.seo-article h2 {
  font-size: 1.35rem;
}

.seo-article h3 {
  font-size: 1.1rem;
}

.seo-article p,
.seo-article li {
  margin: 0 0 1rem;
  color: var(--seo-fg);
  font-size: 1.05rem;
}

.seo-article ul,
.seo-article ol {
  margin: 0 0 1rem;
  padding-left: 1.25rem;
}

.seo-article blockquote {
  margin: 0 0 1rem;
  padding: 0.7rem 0.85rem;
  border-left: 2px solid var(--seo-accent);
  color: #d1d5db;
}

.seo-article pre,
.seo-article code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.92rem;
}

.seo-article pre {
  overflow-x: auto;
  padding: 0.85rem 1rem;
  background: rgba(0, 0, 0, 0.28);
  border-radius: 0.75rem;
}

.seo-article table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 1rem;
}

.seo-article img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 0 1rem;
  border-radius: 0.85rem;
}

.seo-article th,
.seo-article td {
  border: 1px solid var(--seo-border);
  padding: 0.45rem 0.6rem;
  text-align: left;
}

.seo-blog-list p {
  margin: 0.35rem 0 0;
  color: var(--seo-muted);
  font-size: 0.95rem;
}

.seo-blog-lead {
  max-width: 38rem;
  margin: 0 0 1.75rem;
  color: var(--seo-muted);
  font-size: 1.05rem;
}

.seo-blog-index {
  list-style: none;
  margin: 0 0 2.5rem;
  padding: 0;
  display: grid;
  gap: 1rem;
}

.seo-blog-card {
  display: block;
  padding: 1.25rem 1.3rem 1.15rem;
  border: 1px solid var(--seo-border);
  border-radius: 1.15rem;
  background:
    linear-gradient(180deg, rgba(52, 211, 153, 0.08), transparent 42%),
    var(--seo-card);
  text-decoration: none;
}

.seo-blog-card-lead {
  padding: 1.6rem 1.45rem 1.35rem;
}

.seo-blog-kicker {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 0.55rem;
}

.seo-blog-kicker time,
.seo-blog-card time {
  display: block;
  margin: 0;
  color: var(--seo-accent);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.seo-blog-locale {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(52, 211, 153, 0.45);
  border-radius: 999px;
  padding: 0.05rem 0.4rem;
  color: var(--seo-accent);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.06em;
}

.seo-blog-switch {
  display: flex;
  gap: 0.4rem;
  margin: 0 0 0.8rem;
}

.seo-blog-switch a {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--seo-border);
  border-radius: 999px;
  padding: 0.15rem 0.55rem;
  color: #d1d5db;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.seo-blog-switch a[aria-current="true"] {
  border-color: rgba(52, 211, 153, 0.45);
  color: var(--seo-accent);
}

.seo-blog-thumb,
.seo-blog-hero {
  display: block;
  width: 100%;
  object-fit: cover;
  border-radius: 0.9rem;
}

.seo-blog-thumb {
  height: 11rem;
  margin: 0 0 0.9rem;
}

.seo-blog-card-lead .seo-blog-thumb {
  height: 16rem;
}

.seo-blog-hero {
  max-height: 28rem;
  margin: 0 0 1.15rem;
}

.seo-blog-card h2 {
  margin: 0;
  color: #fff;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.25;
}

.seo-blog-card-lead h2 {
  font-size: clamp(1.6rem, 3vw, 2.15rem);
  line-height: 1.15;
}

.seo-blog-card p {
  margin: 0.7rem 0 0;
  color: #d1d5db;
  font-size: 1.02rem;
  line-height: 1.5;
}

.seo-blog-card-lead p {
  max-width: 40rem;
  font-size: 1.12rem;
}

.seo-blog-read {
  display: inline-block;
  margin-top: 1rem;
  color: var(--seo-accent);
  font-size: 0.92rem;
  font-weight: 700;
}

.seo-blog-read::after {
  content: " →";
}

.seo-blog-card:hover,
.seo-blog-card:focus {
  border-color: rgba(52, 211, 153, 0.45);
  text-decoration: none;
}

.seo-blog-card:hover h2,
.seo-blog-card:focus h2,
.seo-blog-card:hover .seo-blog-read,
.seo-blog-card:focus .seo-blog-read {
  color: var(--seo-accent);
}

.seo-related {
  margin-top: 2.5rem;
}

.seo-related h2 {
  margin: 0 0 1rem;
  font-size: 1.15rem;
  font-weight: 600;
  color: #fff;
}
