:root {
      --green: #133f1f;
      --green-soft: #1f5a30;
      --sand: #d5d2ce;
      --bg: #f5f4f2;
      --card: #ffffff;
      --text: #1e2722;
      --muted: #5b655f;
      --line: #dbe0dc;
      --r-lg: 22px;
      --r-md: 14px;
      --container: min(1160px, 92vw);
      --shadow: 0 12px 26px rgba(19, 63, 31, 0.1);
      --top-row: 82px;
      --nav-row: 56px;
      --logo-stack-height: calc(var(--top-row) + var(--nav-row));
      --anchor-offset: calc(var(--top-row) + var(--nav-row) + 14px);
    }
    * { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }
    body {
      font-family: "Cairo", "Segoe UI", sans-serif;
      font-weight: 400;
      color: var(--text);
      background: radial-gradient(circle at top left, rgba(19,63,31,.08), transparent 36%), var(--bg);
      line-height: 1.65;
      font-size: 1.03rem;
    }
    main {
      position: relative;
      isolation: isolate;
    }
    main::before {
      content: "";
      position: absolute;
      inset: 0;
      background: url("../images/udruga-vijal-bgimage.png") center/cover no-repeat;
      opacity: .14;
      filter: saturate(.9);
      pointer-events: none;
      z-index: -1;
    }
    a { color: inherit; text-decoration: none; }
    .link-accent {
      color: var(--green-soft);
      font-weight: 700;
      text-decoration: underline;
      text-decoration-thickness: 1.5px;
      text-underline-offset: 2px;
    }
    .link-accent:hover, .link-accent:focus-visible { color: #0f3b1f; }
    img { max-width: 100%; display: block; }
    [id] { scroll-margin-top: var(--anchor-offset); }

    .header {
      position: sticky; top: 0; z-index: 999;
      background: rgba(255,255,255,.95);
      backdrop-filter: blur(7px);
      border-bottom: 1px solid rgba(19,63,31,.14);
    }
    .bar, .nav-inner, .section { width: var(--container); margin: 0 auto; }
    .bar {
      min-height: var(--top-row);
      display: flex; align-items: center; justify-content: space-between;
      gap: .8rem; padding: .55rem 0;
    }
    .brand {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      flex: 1 1 auto;
      min-width: 0;
      min-height: var(--top-row);
      padding-left: 265px;
      padding-right: 128px;
      gap: 0;
    }
    .brand img {
      position: absolute;
      left: 0;
      top: 0;
      height: var(--logo-stack-height);
      width: auto;
      object-fit: contain;
    }
    .brand-text {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
    }
    .brand b {
      font-family: "Cairo", "Segoe UI", sans-serif;
      color: #10371d;
      line-height: 1.08;
      font-size: clamp(1.26rem, 2.95vw, 2.05rem);
      font-weight: 900;
      letter-spacing: .012em;
      text-shadow: 0 1px 0 rgba(255,255,255,.4);
      display: block;
    }
    .brand-subtitle {
      color: #2f4b39;
      font-size: clamp(.88rem, 1.25vw, .98rem);
      line-height: 1.2;
      margin-top: .1rem;
      display: block;
    }
    .brand-location {
      color: #3b5a47;
      font-size: clamp(.95rem, 1.35vw, 1.1rem);
      line-height: 1.2;
      margin-top: .36rem;
      display: block;
      letter-spacing: .01em;
      font-weight: 700;
    }

    .icons { display: flex; align-items: center; justify-content: flex-end; gap: .5rem; min-width: 128px; flex-wrap: nowrap; }
    .icon-btn {
      width: 42px; height: 42px; border-radius: 999px;
      border: 1px solid #0f3b1f;
      display: inline-flex; align-items: center; justify-content: center;
      flex: 0 0 42px;
      aspect-ratio: 1 / 1;
      color: #fff; background: #133f1f;
      box-shadow: 0 6px 14px rgba(19,63,31,.22);
      transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease, border-color .2s ease;
    }
    .icon-btn:hover, .icon-btn:focus-visible {
      background: #0d3119;
      border-color: #0d3119;
      color: #fff;
      transform: translateY(-2px);
      box-shadow: 0 10px 18px rgba(13,49,25,.28);
      outline: none;
    }
    .icon-btn svg { width: 18px; height: 18px; fill: currentColor; }

    .menu-toggle {
      display: none;
      width: 41px; height: 41px;
      border: 1px solid rgba(19,63,31,.25);
      border-radius: 10px; background: #fff; color: var(--green);
      align-items: center; justify-content: center;
    }
    .menu-toggle svg { width: 21px; height: 21px; }

    .nav { border-top: 1px solid rgba(19,63,31,.08); }
    .nav.no-anim { transition: none !important; }
    .nav-inner { padding-left: 265px; }
    .menu {
      list-style: none;
      min-height: var(--nav-row);
      display: flex; align-items: center; gap: .38rem;
    }
    .menu > li { position: relative; display: flex; align-items: center; gap: .2rem; }
    .menu > li > a {
      font-family: "Cairo", "Segoe UI", sans-serif;
      font-size: 1rem;
      font-weight: 700;
      color: #173821;
      letter-spacing: .01em;
      min-height: 46px;
      display: inline-flex;
      align-items: center;
      padding: .52rem .95rem;
      border-radius: 11px;
      border: 1px solid transparent;
      transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
    }
    .menu > li > a:hover, .menu > li > a:focus-visible {
      background: rgba(19,63,31,.1);
      color: var(--green);
      border-color: rgba(19,63,31,.2);
      transform: translateY(-1px);
    }

    .sub-btn {
      border: 1px solid transparent;
      background: rgba(19,63,31,.05);
      color: var(--green);
      width: 30px; height: 30px; border-radius: 8px;
      display: inline-flex; align-items: center; justify-content: center;
      transition: background-color .2s ease, border-color .2s ease;
    }
    .sub-btn:hover, .sub-btn:focus-visible { background: rgba(19,63,31,.12); border-color: rgba(19,63,31,.2); }
    .sub-btn svg { width: 12px; height: 12px; transition: .2s ease; }

    .submenu {
      list-style: none;
      position: absolute; left: 0; top: calc(100% + 8px);
      min-width: 230px;
      background: #fff; border: 1px solid var(--line); border-radius: 12px;
      box-shadow: var(--shadow);
      padding: .4rem;
      opacity: 0; visibility: hidden; transform: translateY(8px);
      transition: .2s ease;
      z-index: 40;
    }
    .submenu a { display: block; padding: .5rem .7rem; border-radius: 8px; color: #2f3f37; font-size: .97rem; font-weight: 600; }
    .submenu a:hover, .submenu a:focus-visible { background: rgba(19,63,31,.1); color: var(--green); }

    .has-sub:hover .submenu, .has-sub:focus-within .submenu, .has-sub.open .submenu { opacity: 1; visibility: visible; transform: translateY(0); }
    .has-sub.open .sub-btn svg { transform: rotate(180deg); }

    .hero {
      min-height: clamp(530px, 76vh, 760px);
      display: flex; align-items: center;
      color: #fff;
      background:
        linear-gradient(110deg, rgba(12,37,21,.89) 8%, rgba(12,37,21,.58) 55%, rgba(12,37,21,.2) 100%),
        url("../images/udruga-vijal-bgimage.png") center/cover no-repeat;
    }
    .hero-inner {
      width: var(--container);
      margin: 0 auto;
      padding: 3.8rem 0;
      display: grid;
      grid-template-columns: 1.12fr .88fr;
      gap: 1.5rem;
    }
    .hero h1 {
      font-family: "Cairo", "Segoe UI", sans-serif;
      font-size: clamp(1.75rem, 4.8vw, 3rem);
      line-height: 1.15;
      max-width: 16ch;
    }
    .hero p { margin-top: 1rem; max-width: 58ch; color: rgba(248,246,243,.95); font-size: clamp(1rem, 2vw, 1.14rem); }
    .btns { margin-top: 1.4rem; display: flex; flex-wrap: wrap; gap: .72rem; }
    .btn {
      min-height: 47px; border-radius: 999px; padding: .68rem 1.1rem;
      font-family: "Cairo", "Segoe UI", sans-serif; font-weight: 700; font-size: .92rem;
      border: 1px solid transparent;
      display: inline-flex; align-items: center; justify-content: center;
      transition: .2s ease;
    }
    .btn-primary { background: var(--sand); color: var(--green); border-color: rgba(255,255,255,.3); }
    .btn-outline { background: rgba(255,255,255,.06); color: #fff; border-color: rgba(255,255,255,.52); }
    .btn:hover, .btn:focus-visible { transform: translateY(-2px); }

    .stats { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .75rem; align-self: end; }
    .stat {
      background: rgba(255,255,255,.92);
      color: var(--text);
      border: 1px solid rgba(19,63,31,.16);
      border-radius: 14px;
      padding: .9rem;
      box-shadow: var(--shadow);
    }
    .stat b { display: block; font-family: "Cairo", "Segoe UI", sans-serif; color: var(--green); font-size: 1.5rem; line-height: 1.1; }
    .stat span { color: #47534c; font-size: .93rem; }

    .section { padding: clamp(2.5rem, 6vw, 4.2rem) 0; }
    .section h2 {
      position: relative;
      display: inline-flex;
      align-items: center;
      font-family: "Cairo", "Segoe UI", sans-serif;
      color: var(--green);
      font-size: clamp(1.46rem, 3vw, 2.16rem);
      line-height: 1.18;
      margin-bottom: .9rem;
      padding: .3rem .92rem .4rem .96rem;
      border-radius: 13px;
      border: 1px solid rgba(19,63,31,.18);
      background: linear-gradient(135deg, rgba(19,63,31,.14), rgba(19,63,31,.04));
      box-shadow: 0 8px 16px rgba(19,63,31,.08);
    }
    .intro {
      color: #3f4b44;
      font-weight: 700;
      max-width: 86ch;
      margin-bottom: 1rem;
      padding: .72rem .95rem .72rem 1.08rem;
      border-radius: 0 12px 12px 0;
      border: 1px solid rgba(19,63,31,.15);
      border-left: 4px solid rgba(19,63,31,.42);
      background: rgba(255,255,255,.74);
      box-shadow: 0 8px 20px rgba(19,63,31,.06);
      line-height: 1.58;
    }
    .intro-nowrap { max-width: none; white-space: nowrap; }
    .card {
      background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg);
      padding: clamp(1rem, 2.5vw, 1.8rem);
      box-shadow: 0 10px 24px rgba(19,63,31,.08);
      margin-top: .95rem;
    }
    .card h3 { font-family: "Cairo", "Segoe UI", sans-serif; color: var(--green-soft); margin-bottom: .62rem; font-size: clamp(1.16rem, 2vw, 1.45rem); }
    .split { display: grid; grid-template-columns: 1.05fr .95fr; gap: 1rem; }
    #o-vijalu .o-vijalu-image {
      float: right;
      width: min(44%, 430px);
      margin: .05rem 0 .85rem 1rem;
      border-radius: 12px;
      overflow: hidden;
      border: 1px solid rgba(19,63,31,.2);
      box-shadow: 0 8px 18px rgba(19,63,31,.08);
    }
    #o-vijalu .o-vijalu-image img {
      width: 100%;
      height: auto;
      display: block;
    }
    #o-vijalu .o-vijalu-break { margin-top: .42rem; }
    #o-vijalu::after { content: ""; display: block; clear: both; }
    .list { list-style: none; display: grid; gap: .48rem; margin-top: .75rem; }
    .list li { position: relative; padding-left: 1.05rem; }
    .list li::before {
      content: ""; width: .5rem; height: .5rem; border-radius: 999px;
      background: var(--green); position: absolute; left: 0; top: .57rem;
      box-shadow: 0 0 0 4px rgba(19,63,31,.12);
    }
    .team-list {
      list-style: none;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: .62rem;
      margin-top: .8rem;
    }
    .team-list li {
      padding: .72rem .85rem;
      border: 1px solid var(--line);
      border-left: 4px solid rgba(19,63,31,.35);
      border-radius: 12px;
      background: linear-gradient(160deg, #fff, #f8faf8);
      color: #24332c;
      line-height: 1.5;
    }
    .team-list strong {
      color: var(--green);
      font-weight: 700;
    }
    .gallery { margin-top: .9rem; display: grid; grid-template-columns: repeat(12, minmax(0,1fr)); gap: .75rem; }
    .gallery figure { border-radius: 12px; overflow: hidden; border: 1px solid rgba(19,63,31,.2); min-height: 180px; }
    .gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s ease; }
    .gallery figure:hover img { transform: scale(1.03); }
    .zoomable-desktop { cursor: zoom-in; }
    .img-lightbox {
      position: fixed;
      inset: 0;
      background: rgba(10, 20, 14, .84);
      display: none;
      align-items: center;
      justify-content: center;
      padding: 2rem;
      z-index: 1300;
    }
    .img-lightbox.open { display: flex; }
    .img-lightbox__img {
      max-width: min(94vw, 1360px);
      max-height: 88vh;
      width: auto;
      height: auto;
      object-fit: contain;
      border-radius: 12px;
      box-shadow: 0 18px 36px rgba(0,0,0,.34);
      cursor: zoom-out;
    }
    .img-lightbox__close {
      position: absolute;
      top: 14px;
      right: 14px;
      width: 42px;
      height: 42px;
      border: 1px solid rgba(255,255,255,.35);
      border-radius: 999px;
      background: rgba(20, 45, 30, .78);
      color: #fff;
      font-size: 1.45rem;
      line-height: 1;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
    }
    .img-lightbox__close:hover,
    .img-lightbox__close:focus-visible {
      background: rgba(20, 45, 30, .95);
      outline: none;
    }
    body.lightbox-open { overflow: hidden; }
    .w-12 { grid-column: span 12; }
    .w-6 { grid-column: span 6; }
    .w-4 { grid-column: span 4; }
    .w-3 { grid-column: span 3; }

    .docs { margin-top: .7rem; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .68rem; }
    .doc {
      position: relative;
      border: 1px solid rgba(19,63,31,.25);
      border-left: 4px solid rgba(19,63,31,.45);
      border-radius: 12px;
      padding: .8rem 2.65rem .8rem .95rem;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: .8rem;
      background: linear-gradient(140deg, #ffffff, #f8fbf8);
      box-shadow: 0 4px 10px rgba(19,63,31,.05);
      transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
      cursor: pointer;
    }
    .doc::after {
      content: "↗";
      position: absolute;
      right: .9rem;
      top: 50%;
      transform: translateY(-50%);
      font-size: 1rem;
      color: #1a5a2a;
      opacity: .82;
      transition: transform .2s ease, opacity .2s ease;
      pointer-events: none;
    }
    .doc:hover,
    .doc:focus-visible {
      border-color: rgba(19,63,31,.5);
      box-shadow: 0 10px 18px rgba(19,63,31,.11);
      background: linear-gradient(140deg, #ffffff, #f5faf6);
      transform: translateY(-2px);
      outline: none;
    }
    .doc:hover::after,
    .doc:focus-visible::after {
      transform: translateY(-50%) translateX(2px);
      opacity: 1;
    }
    .doc span { line-height: 1.35; font-size: .96rem; font-weight: 700; color: #20402a; }
    .doc b {
      font-family: "Cairo", "Segoe UI", sans-serif;
      color: var(--green);
      font-size: .8rem;
      letter-spacing: .02em;
      background: rgba(19,63,31,.08);
      border: 1px solid rgba(19,63,31,.18);
      border-radius: 999px;
      padding: .12rem .48rem;
    }

    .grid2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .85rem; margin-top: .86rem; }
    .mini {
      border: 1px solid var(--line); border-radius: var(--r-md);
      padding: .9rem;
      background: linear-gradient(160deg, #fff, #faf9f7);
    }
    .mini h4 { color: var(--green); font-family: "Cairo", "Segoe UI", sans-serif; margin-bottom: .5rem; font-size: .98rem; }
    .mini-note {
      margin-top: .6rem;
      font-size: .84rem;
      color: #5b6961;
    }

    .don-grid { margin-top: .8rem; display: grid; grid-template-columns: 1fr; gap: .85rem; }
    .don {
      border: 1px solid var(--line); border-radius: var(--r-md);
      padding: .85rem; background: #fff;
    }
    .don h4 { color: var(--green); font-family: "Cairo", "Segoe UI", sans-serif; margin-bottom: .55rem; }
    .bank { display: grid; gap: .24rem; color: #30423a; font-size: .94rem; }
    .bank code { background: #f1f4f2; border-radius: 6px; padding: .08rem .3rem; font-family: "Cairo", "Segoe UI", sans-serif; font-size: .84rem; font-weight: 700; }
    .don-uplatnica { padding: 1rem; }
    .don-uplatnica-layout {
      display: grid;
      grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr);
      gap: .95rem;
      align-items: start;
    }
    .uplatnica-img {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 12px;
      display: block;
    }
    .suradnja-goals {
      width: min(100%, 780px);
      margin: .78rem 0 .86rem;
      border: 1px solid var(--line);
      border-radius: 12px;
      overflow: hidden;
      background: #fff;
      box-shadow: 0 6px 14px rgba(19,63,31,.06);
    }
    .suradnja-goals img {
      width: 100%;
      height: auto;
      display: block;
    }

    .faq-list { display: grid; gap: .7rem; margin-top: .9rem; }
    #faq .intro {
      color: #4f5c55;
      font-weight: 500;
      background: transparent;
      border: 0;
      border-left: 0;
      box-shadow: none;
      padding: .1rem 0 .2rem;
      margin-bottom: .55rem;
    }
    .faq {
      border: 1px solid #d6ddd8;
      border-radius: 12px;
      background: #fff;
      overflow: hidden;
      transition: border-color .2s ease, box-shadow .2s ease;
    }
    .faq:hover { border-color: #afbeb5; }
    .faq[open] { border-color: #9eb4a7; box-shadow: 0 8px 18px rgba(19,63,31,.07); }
    .faq summary {
      list-style: none; cursor: pointer; user-select: none;
      font-family: "Cairo", "Segoe UI", sans-serif;
      color: #24332c;
      font-size: .99rem;
      font-weight: 700;
      letter-spacing: 0;
      padding: .9rem 2.7rem .9rem 1.05rem;
      position: relative;
      background: #f8fbf9;
    }
    .faq summary::before {
      content: "";
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      width: 4px;
      background: rgba(19,63,31,.35);
    }
    .faq summary:hover, .faq summary:focus-visible { background: #f1f7f3; }
    .faq summary::-webkit-details-marker { display: none; }
    .faq summary::after {
      content: "+";
      position: absolute;
      right: .9rem;
      top: 50%;
      transform: translateY(-50%);
      font-size: 1.25rem;
      color: #1f5030;
    }
    .faq[open] summary::after { content: "−"; }
    .faq .content { border-top: 1px solid var(--line); padding: 0 .95rem .92rem; color: var(--muted); }
    .faq .content p, .faq .content ul { margin-top: .72rem; }

    .contact { display: grid; grid-template-columns: .95fr 1.05fr; gap: .9rem; margin-top: .95rem; }
    .box { border: 1px solid var(--line); border-radius: var(--r-md); background: #fff; padding: .95rem; }
    .box h3 { color: var(--green); font-family: "Cairo", "Segoe UI", sans-serif; margin-bottom: .6rem; }
    .points { list-style: none; display: grid; gap: .65rem; }
    .points li { display: flex; gap: .58rem; color: #33423a; }
    .points svg { width: 16px; height: 16px; fill: var(--green); flex-shrink: 0; margin-top: .25rem; }

    form { display: grid; gap: .72rem; }
    .hp-field {
      position: absolute;
      left: -9999px;
      width: 1px;
      height: 1px;
      opacity: 0;
      pointer-events: none;
      overflow: hidden;
    }
    .form-feedback {
      display: none;
      margin: .1rem 0 .15rem;
      padding: .52rem .72rem;
      border-radius: 10px;
      border: 1px solid transparent;
      font-size: .9rem;
      line-height: 1.4;
      font-weight: 600;
    }
    .form-feedback.show { display: block; }
    .form-feedback.success {
      color: #0f5132;
      background: #edf8f1;
      border-color: #b7dfc4;
    }
    .form-feedback.error {
      color: #842029;
      background: #fff2f2;
      border-color: #f2c2c2;
    }
    .captcha-question {
      margin: .08rem 0 .35rem;
      color: #2f4337;
      font-size: .9rem;
      font-weight: 700;
      line-height: 1.35;
    }
    label { font-size: .92rem; font-weight: 700; color: #304139; }
    input, textarea {
      width: 100%; border: 1px solid rgba(19,63,31,.26); border-radius: 10px;
      padding: .63rem .7rem; font: inherit; color: var(--text); background: #fff;
    }
    textarea { min-height: 140px; resize: vertical; }
    input:focus-visible, textarea:focus-visible { outline: 2px solid rgba(19,63,31,.22); outline-offset: 1px; border-color: var(--green); }

    .footer {
      margin-top: 2rem;
      background: #0f2d17;
      color: #eef4f0;
      border-top: 1px solid rgba(255,255,255,.15);
    }
    .footer-inner {
      width: var(--container); margin: 0 auto;
      padding: 1.9rem 0 1.15rem;
      display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1rem;
    }
    .footer h3 { font-family: "Cairo", "Segoe UI", sans-serif; margin-bottom: .55rem; font-size: 1rem; }
    .footer p, .footer li { font-size: .95rem; line-height: 1.5; }
    .footer ul { list-style: none; display: grid; gap: .3rem; }
    .footer-contact {
      margin-top: .2rem;
      display: grid;
      gap: .1rem;
    }
    .footer-contact-item {
      display: inline-flex;
      align-items: center;
      gap: .35rem;
      color: #eef4f0;
      font-size: .95rem;
      line-height: 1.35;
      width: fit-content;
    }
    .footer-contact-item a { color: inherit; text-decoration: none; }
    .footer-contact-item a:hover, .footer-contact-item a:focus-visible { text-decoration: underline; }
    .footer-contact-item svg {
      width: 20px;
      height: 20px;
      padding: 3px;
      background: rgba(255,255,255,.16);
      border: 1px solid rgba(255,255,255,.25);
      border-radius: 999px;
      fill: currentColor;
      flex-shrink: 0;
      opacity: 1;
    }
    .bottom {
      width: var(--container); margin: 0 auto;
      border-top: 1px solid rgba(255,255,255,.2);
      padding: .72rem 0 .95rem;
      font-size: .87rem;
      display: flex;
      justify-content: center;
      text-align: center;
    }

    .reveal { opacity: 0; transform: translateY(16px); transition: opacity .55s ease, transform .55s ease; }
    .reveal.show { opacity: 1; transform: none; }

    @media (max-width: 1080px) {
      .hero-inner { grid-template-columns: 1fr; }
      .stats { max-width: 620px; }
      .split { grid-template-columns: 1fr; }
    }
    @media (max-width: 960px) {
      :root { --anchor-offset: calc(var(--top-row) + 12px); }
      main::before { opacity: .12; }
      .menu-toggle { display: inline-flex; }
      .section h2 { max-width: 100%; padding: .28rem .74rem .36rem .8rem; }
      .intro { padding: .64rem .78rem .64rem .86rem; }
      .brand { flex: 0 1 auto; justify-content: flex-start; padding-left: 0; padding-right: 0; min-height: 0; gap: .65rem; }
      .brand img { position: static; width: auto; height: 56px; }
      .brand-text { align-items: flex-start; text-align: left; }
      .brand b { font-size: clamp(1.04rem, 4.2vw, 1.24rem); line-height: 1.12; }
      .brand-subtitle, .brand-location { display: none; }
      .icons { min-width: 0; gap: .35rem; }
      .icons .icon-btn { display: none; }
      .header.menu-open .icons .icon-btn { display: inline-flex; }
      .icon-btn {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
      }
      .icon-btn svg { width: 15px; height: 15px; }
      .nav-inner { padding-left: 0; }
      .nav { max-height: 0; overflow: hidden; transition: max-height .3s ease; }
      .nav.open { max-height: 90vh; }
      .menu { min-height: 0; display: grid; gap: .15rem; padding: .55rem 0 .9rem; }
      .menu > li { display: grid; grid-template-columns: 1fr auto; }
      .team-list { grid-template-columns: 1fr; }
      .intro-nowrap { white-space: normal; }
      #o-vijalu .o-vijalu-image {
        float: none;
        width: 100%;
        margin: .2rem 0 .75rem;
      }
      .don-uplatnica-layout { grid-template-columns: 1fr; }
      .submenu {
        position: static; min-width: 0;
        border: 0; box-shadow: none;
        background: rgba(19,63,31,.07);
        max-height: 0; padding: 0; margin: 0 .45rem .4rem;
        overflow: hidden; opacity: 1; visibility: visible; transform: none;
        transition: max-height .25s ease, padding .25s ease;
        grid-column: 1 / -1;
      }
      .has-sub:hover .submenu, .has-sub:focus-within .submenu { max-height: 0; padding: 0; }
      .has-sub.open .submenu { max-height: 360px; padding: .35rem; }
      .docs, .grid2, .don-grid, .contact, .footer-inner { grid-template-columns: 1fr; }
      .zoomable-desktop { cursor: default; }
      .img-lightbox { display: none !important; }
    }
    @media (max-width: 720px) {
      .btns .btn { width: 100%; }
      .stats { grid-template-columns: 1fr; }
      .w-6, .w-4, .w-3 { grid-column: span 12; }
    }