/* ODR responsive v6
   - restores complete modern contact card styles
   - smaller desktop contact email
   - stronger mobile Donacije / Članovi actions
   - heart icon for mobile donation CTA
   - keeps approved V5 mobile grid menu and overall responsive layout
*/

/* Mobile-only navigation links stay hidden on desktop */
.mobile-member-link,
.mobile-join-link{display:none !important;}
.mobile-nav-icon{display:none;}
.mobile-donate-heart{display:none;}

/* CONTACT: robust modern card styles on all breakpoints */
.contact-card{
  display:grid !important;
  grid-template-columns:48px minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:15px !important;
  padding:20px !important;
  border:1px solid #dce8e1 !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 18px 46px rgba(11,41,69,.08) !important;
}
.contact-card-icon{
  width:48px !important;
  height:48px !important;
  border-radius:15px !important;
  display:grid !important;
  place-items:center !important;
  background:linear-gradient(135deg,#eaf8ef,#d9f1e3) !important;
  color:#08733c !important;
  overflow:hidden !important;
}
.contact-card-icon svg{
  width:23px !important;
  height:23px !important;
  max-width:23px !important;
  max-height:23px !important;
  fill:currentColor !important;
  display:block !important;
}
.contact-card-copy{display:grid !important;gap:4px !important;min-width:0 !important;}
.contact-card-copy small{
  font-size:.72rem !important;
  font-weight:800 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:#17844a !important;
}
.contact-card-copy strong{
  font-family:Manrope,Inter,sans-serif !important;
  font-size:clamp(.98rem,1.15vw,1.13rem) !important;
  line-height:1.24 !important;
  color:#0b2945 !important;
  overflow-wrap:anywhere !important;
}
.contact-card-copy span{font-size:.80rem !important;color:#6f808d !important;line-height:1.4 !important;}
.contact-email-btn{
  white-space:nowrap !important;
  padding:12px 16px !important;
  font-size:.90rem !important;
  border-radius:13px !important;
}
.contact-email-btn b{font-size:1.03em !important;}

@media (min-width:931px){
  .contact-card-copy strong{
    white-space:nowrap !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
  }
}

@media (max-width:1100px){
  .main-nav{gap:14px !important;font-size:.79rem !important;}
  .nav-actions{gap:7px !important;}
  .nav-donate{padding:10px 13px !important;}
}

@media (max-width:930px){
  html{scroll-padding-top:82px !important;}
  .site-header{overflow:visible !important;}
  .nav-wrap{position:relative !important;min-height:76px !important;gap:10px !important;}
  .brand-full img{width:52px !important;height:52px !important;}
  .brand-copy{display:none !important;}
  .nav-toggle{
    display:flex !important;
    order:2 !important;
    margin-left:auto !important;
    width:46px !important;
    height:46px !important;
    border-radius:14px !important;
    position:relative !important;
    z-index:102 !important;
  }
  .nav-actions{order:3 !important;}
  .nav-actions .nav-donate,
  .nav-actions .nav-member,
  .nav-actions .nav-join{display:none !important;}
  .lang-switch{padding:4px !important;border-radius:13px !important;}
  .lang-switch a{padding:8px 10px !important;font-size:.74rem !important;border-radius:10px !important;}

  .main-nav{
    display:none !important;
    position:absolute !important;
    top:calc(100% + 10px) !important;
    right:10px !important;
    left:auto !important;
    width:min(360px,calc(100vw - 28px)) !important;
    padding:10px !important;
    background:rgba(255,255,255,.98) !important;
    border:1px solid #dce8e1 !important;
    border-radius:22px !important;
    box-shadow:0 24px 60px rgba(11,41,69,.20) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;
    z-index:999 !important;
  }
  .nav-open .main-nav{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:7px !important;
  }
  .main-nav a{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    min-height:46px !important;
    padding:11px 12px !important;
    margin:0 !important;
    border:1px solid #edf2ef !important;
    border-radius:13px !important;
    background:#f8faf9 !important;
    color:#102b45 !important;
    font-size:.88rem !important;
    font-weight:760 !important;
    line-height:1.15 !important;
    text-decoration:none !important;
  }
  .main-nav a:after{display:none !important;}
  .main-nav a:hover{background:#f1f7f3 !important;}

  /* Distinct action cards */
  .main-nav .mobile-donations-link{
    display:flex !important;
    gap:8px !important;
    background:linear-gradient(135deg,#e9f8ee,#dff3e6) !important;
    border-color:#c8e8d2 !important;
    color:#08733c !important;
    box-shadow:0 7px 18px rgba(18,149,71,.10) !important;
  }
  .main-nav .mobile-member-link{
    display:flex !important;
    gap:8px !important;
    background:linear-gradient(135deg,#eef3f7,#e7eef3) !important;
    border-color:#d6e1e9 !important;
    color:#0b2945 !important;
    box-shadow:0 7px 18px rgba(11,41,69,.08) !important;
  }
  .mobile-nav-icon{
    display:inline-grid !important;
    place-items:center !important;
    width:23px !important;
    height:23px !important;
    flex:0 0 23px !important;
    border-radius:8px !important;
    font-size:.92rem !important;
    line-height:1 !important;
  }
  .mobile-nav-heart{background:#d5f0de !important;color:#08733c !important;}
  .mobile-nav-member{background:#dce7ef !important;color:#0b2945 !important;font-size:.56rem !important;}

  .main-nav .mobile-join-link{
    display:flex !important;
    justify-content:center !important;
    grid-column:1 / -1 !important;
    color:#fff !important;
    background:linear-gradient(135deg,#08733c,#13a250) !important;
    border-color:transparent !important;
    box-shadow:0 10px 22px rgba(18,149,71,.18) !important;
  }

  .nav-toggle span{transition:transform .22s ease,opacity .22s ease !important;}
  .nav-open .nav-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg) !important;}
  .nav-open .nav-toggle span:nth-child(2){opacity:0 !important;}
  .nav-open .nav-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg) !important;}

  .contact-grid{grid-template-columns:1fr !important;gap:24px !important;align-items:start !important;}
}

@media (max-width:650px){
  .container{width:min(100% - 28px,1210px) !important;}

  .main-nav{right:8px !important;width:min(350px,calc(100vw - 24px)) !important;}
  .main-nav a{font-size:.86rem !important;min-height:44px !important;padding:10px 11px !important;}

  /* Contact: compact, balanced mobile card */
  .contact-section{padding-top:56px !important;padding-bottom:56px !important;}
  .contact-grid{gap:22px !important;}
  .contact-card{
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:12px !important;
    padding:15px !important;
    border-radius:20px !important;
    box-shadow:0 16px 34px rgba(11,41,69,.07) !important;
  }
  .contact-card-icon{
    width:42px !important;
    height:42px !important;
    border-radius:13px !important;
  }
  .contact-card-icon svg{width:21px !important;height:21px !important;max-width:21px !important;max-height:21px !important;}
  .contact-card-copy small{font-size:.67rem !important;}
  .contact-card-copy strong{
    font-size:.94rem !important;
    line-height:1.28 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }
  .contact-card-copy span{font-size:.74rem !important;}
  .contact-email-btn{
    grid-column:1 / -1 !important;
    width:100% !important;
    margin-top:2px !important;
    padding:13px 15px !important;
    font-size:.88rem !important;
  }
  .contact-meta{gap:8px !important;}
  .contact-meta span{font-size:.74rem !important;padding:7px 9px !important;}

  /* Homepage donation CTA: heart instead of arrow on mobile */
  .donate-button .desktop-donate-arrow{display:none !important;}
  .donate-button .mobile-donate-heart{
    display:inline !important;
    color:#0b2945 !important;
    font-size:1.18em !important;
    line-height:1 !important;
  }
}

@media (max-width:390px){
  .nav-open .main-nav{grid-template-columns:1fr !important;}
  .main-nav .mobile-join-link{grid-column:auto !important;}
}