/* Final logo, marketing banner and approved Contact presentation. */

.brand-logo {
  width: 68px !important;
  height: 68px !important;
  aspect-ratio: 1;
  object-fit: contain !important;
  border-radius: 50% !important;
  background: transparent !important;
}

.cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 300px;
  padding: clamp(38px, 5vw, 58px);
  color: #fff;
  border: 1px solid rgba(240,217,135,.42);
  background:
    linear-gradient(90deg, rgba(6,31,22,.92) 0%, rgba(8,41,29,.80) 52%, rgba(8,41,29,.58) 100%),
    linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.26)),
    url('https://www.bihorjust.ro/wp-content/uploads/2024/09/pl6-1024x461.jpg') center 52% / cover no-repeat;
  box-shadow: 0 24px 60px rgba(0,0,0,.28);
}

.cta h2 {
  position: relative;
  z-index: 1;
  max-width: 820px;
  color: #fff;
  text-shadow: 0 3px 18px rgba(0,0,0,.58);
}

.cta .btn {
  position: relative;
  z-index: 1;
}

.cta .btn-dark {
  background: var(--accent);
  color: #173126;
  box-shadow: 0 10px 28px rgba(0,0,0,.28);
}

.cta .btn-dark:hover { background: var(--accent-2); }

main > section:last-of-type { padding-bottom: 34px; }
footer { margin-top: 0 !important; }

/* =========================================================
   CONTACT — approved desktop reference
   ========================================================= */
section.contact-section#contact {
  min-height: calc(100svh - 96px) !important;
  padding: 68px 0 34px !important;
  display: block !important;
  align-items: initial !important;
  background:
    radial-gradient(circle at 16% 28%, rgba(66,132,89,.10), transparent 34%),
    radial-gradient(circle at 86% 18%, rgba(216,185,93,.045), transparent 24%),
    linear-gradient(180deg, #0a3526 0%, #073024 100%) !important;
}

.contact-section-inner {
  width: calc(100% - 96px) !important;
  max-width: none !important;
  margin: 0 auto !important;
}

.contact-section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 48px !important;
  margin: 0 0 48px !important;
}

.contact-section-head .eyebrow {
  font-size: 12px !important;
  letter-spacing: .15em !important;
}

.contact-section-head h2 {
  margin: 10px 0 0 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(50px, 4.2vw, 72px) !important;
  line-height: .97 !important;
  letter-spacing: -.04em !important;
  white-space: nowrap;
}

.contact-section-head h2 span { color: var(--accent) !important; }

.contact-section-head p {
  max-width: 570px !important;
  margin: 0 !important;
  color: #e2eae4 !important;
  font-size: clamp(14px, .95vw, 16px) !important;
  line-height: 1.5 !important;
}

.contact-panel-slot { width: 100%; }

.standalone-contact-panel {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 0 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--text) !important;
  box-shadow: none !important;
  display: grid !important;
  grid-template-columns: repeat(6, 76px) !important;
  column-gap: clamp(62px, 5vw, 94px) !important;
  row-gap: 0 !important;
  justify-content: center !important;
  align-items: start !important;
}

.standalone-contact-panel > h3 { display: none !important; }

/* Four information blocks */
.standalone-contact-panel .contact-list {
  grid-column: 1 / -1;
  width: min(1420px, calc(100vw - 120px)) !important;
  justify-self: center;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  margin: 0 0 42px !important;
  padding: 0 0 48px !important;
  position: relative;
  border: 0 !important;
}

/* Short ornamental separator, exactly between information and channel row. */
.standalone-contact-panel .contact-list::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 330px;
  height: 1px;
  background: linear-gradient(
    90deg,
    rgba(216,185,93,.55) 0 43%,
    transparent 43% 57%,
    rgba(216,185,93,.55) 57% 100%
  );
}

.standalone-contact-panel .contact-list::after {
  content: "✣";
  position: absolute;
  left: 50%;
  bottom: -13px;
  transform: translateX(-50%);
  width: 40px;
  height: 26px;
  display: grid;
  place-items: center;
  color: var(--accent);
  background: #083125;
  font-size: 20px;
  line-height: 1;
}

.standalone-contact-panel .contact-item {
  min-height: 195px !important;
  padding: 18px 22px !important;
  margin: 0 !important;
  border: 0 !important;
  border-right: 1px solid rgba(216,185,93,.20) !important;
  border-radius: 0 !important;
  background: transparent !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  text-align: center !important;
  color: #fff !important;
}

.standalone-contact-panel .contact-item:last-child { border-right: 0 !important; }

.standalone-contact-panel .contact-item > div:first-child {
  width: 70px !important;
  height: 70px !important;
  flex: 0 0 70px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  border: 1px solid rgba(216,185,93,.24) !important;
  background: rgba(216,185,93,.035) !important;
  font-size: 0 !important;
  line-height: 1 !important;
}

.standalone-contact-panel .contact-item > div:first-child::before {
  content: "";
  width: 30px;
  height: 30px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.standalone-contact-panel .contact-item:nth-child(1) > div:first-child::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23efc858' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M20 10c0 5-8 12-8 12S4 15 4 10a8 8 0 1 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='2.6' fill='%23efc858'/%3E%3C/svg%3E");
}

.standalone-contact-panel .contact-item:nth-child(2) > div:first-child::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23efc858' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M5.2 3.8 8.8 3l2.1 4.8-2.2 1.7a15.3 15.3 0 0 0 5.8 5.8l1.7-2.2L21 15.2l-.8 3.6c-.2.9-1 1.5-1.9 1.4C10.6 19.4 4.6 13.4 3.8 5.7c-.1-.9.5-1.7 1.4-1.9Z'/%3E%3C/svg%3E");
}

.standalone-contact-panel .contact-item:nth-child(3) > div:first-child::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='14' rx='2' fill='none' stroke='%23efc858' stroke-width='2'/%3E%3Cpath d='m4 7 8 6 8-6' fill='none' stroke='%23efc858' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.standalone-contact-panel .contact-item:nth-child(4) > div:first-child::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='%23efc858' stroke-width='2'/%3E%3Cpath d='m15.7 8.3-2.2 5.2-5.2 2.2 2.2-5.2 5.2-2.2Z' fill='none' stroke='%23efc858' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.standalone-contact-panel .contact-item strong {
  display: block !important;
  margin: 2px 0 0 !important;
  color: #fff !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
}

.standalone-contact-panel .contact-item span,
.standalone-contact-panel .contact-item span a {
  color: #dce6df !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

/* Existing Maps/WhatsApp wrapper + social wrapper become one six-icon row. */
.standalone-contact-panel > div[style*="display:flex"],
.standalone-contact-panel > .social-bar {
  display: contents !important;
}

.standalone-contact-panel > div[style*="display:flex"] > a,
.standalone-contact-panel .social-link {
  width: 76px !important;
  height: 76px !important;
  min-width: 76px !important;
  min-height: 76px !important;
  padding: 0 !important;
  margin: 14px 0 32px !important;
  justify-self: center !important;
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  overflow: visible !important;
  border-radius: 50% !important;
  border: 1px solid rgba(216,185,93,.34) !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(255,255,255,.06), rgba(255,255,255,.018) 62%, rgba(0,0,0,.05)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.015),
    0 12px 30px rgba(0,0,0,.12) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease !important;
}

.standalone-contact-panel > div[style*="display:flex"] > a:hover,
.standalone-contact-panel .social-link:hover {
  transform: translateY(-4px) scale(1.025) !important;
  border-color: rgba(240,217,135,.84) !important;
  background: rgba(216,185,93,.08) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.18) !important;
}

.standalone-contact-panel .social-link svg {
  display: block !important;
  width: 32px !important;
  height: 32px !important;
  overflow: visible !important;
}

.standalone-contact-panel a[href*="facebook.com"] { color: #1877F2 !important; }
.standalone-contact-panel a[href*="instagram.com"] { color: #E4405F !important; }
.standalone-contact-panel a[href*="youtube.com"] { color: #FF0033 !important; }
.standalone-contact-panel a[href*="tiktok.com"] { color: #fff !important; }

.standalone-contact-panel a[href*="facebook.com"] svg {
  width: 31px !important;
  height: 31px !important;
  filter: drop-shadow(0 2px 5px rgba(24,119,242,.22));
}

.standalone-contact-panel a[href*="instagram.com"] svg {
  width: 32px !important;
  height: 32px !important;
  filter: drop-shadow(0 2px 5px rgba(228,64,95,.22));
}

.standalone-contact-panel a[href*="youtube.com"] svg {
  width: 35px !important;
  height: 27px !important;
  filter: drop-shadow(0 2px 5px rgba(255,0,51,.22));
}

.standalone-contact-panel a[href*="tiktok.com"] svg {
  width: 31px !important;
  height: 31px !important;
  filter:
    drop-shadow(1.4px 0 0 rgba(37,244,238,.88))
    drop-shadow(-1.4px 0 0 rgba(254,44,85,.88));
}

.standalone-contact-panel a[href*="google.com/maps"]::before {
  content: "";
  width: 36px;
  height: 36px;
  display: block;
  filter: drop-shadow(0 2px 5px rgba(0,0,0,.16));
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23EA4335' d='M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7Z'/%3E%3Ccircle cx='12' cy='9' r='2.7' fill='%234285F4'/%3E%3Cpath fill='%23FBBC04' d='M7 17.4c1.7 2.6 5 4.6 5 4.6s1.1-1.2 2.5-3L9 14.5 7 17.4Z' opacity='.9'/%3E%3Cpath fill='%2334A853' d='M5.6 12.4C6 14 6.8 15.7 7.8 17.2l2.3-3.2-4.5-1.6Z'/%3E%3C/svg%3E");
}

.standalone-contact-panel a[href*="wa.me"]::before {
  content: "";
  width: 37px;
  height: 37px;
  display: block;
  filter: drop-shadow(0 2px 5px rgba(37,211,102,.20));
  background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' fill='%2325D366'/%3E%3Cpath fill='%23fff' d='M17.5 14.5c-.3-.2-1.8-.9-2.1-1-.3-.1-.5-.2-.7.2-.2.3-.8 1-.9 1.2-.2.2-.3.2-.6.1-1.6-.8-2.7-1.5-3.8-3.3-.3-.5.3-.5.8-1.5.1-.2 0-.4-.1-.6-.1-.2-.7-1.7-1-2.3-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.6.1-.9.4-.3.3-1.2 1.2-1.2 2.9 0 1.7 1.2 3.3 1.4 3.5.2.2 2.4 3.7 5.9 5.2.8.4 1.5.6 2 .7.8.3 1.6.2 2.2.1.7-.1 1.8-.7 2-1.4.2-.7.2-1.3.2-1.4-.1-.1-.3-.2-.6-.3Z'/%3E%3C/svg%3E");
}

/* Labels below all six channel icons. */
.standalone-contact-panel > div[style*="display:flex"] > a::after,
.standalone-contact-panel .social-link::after {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  color: #edf2ee;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.1;
  white-space: nowrap;
  pointer-events: none;
}

.standalone-contact-panel a[href*="google.com/maps"]::after { content: "Google Maps"; }
.standalone-contact-panel a[href*="wa.me"]::after { content: "WhatsApp"; }
.standalone-contact-panel a[href*="facebook.com"]::after { content: "Facebook"; }
.standalone-contact-panel a[href*="instagram.com"]::after { content: "Instagram"; }
.standalone-contact-panel a[href*="youtube.com"]::after { content: "YouTube"; }
.standalone-contact-panel a[href*="tiktok.com"]::after { content: "TikTok"; }

/* Tablet */
@media (max-width: 1050px) {
  section.contact-section#contact {
    min-height: auto !important;
    padding: 64px 0 70px !important;
  }

  .contact-section-head {
    align-items: flex-start !important;
    margin-bottom: 48px !important;
  }

  .contact-section-head .eyebrow {
    font-size: 14px !important;
  }

  .contact-section-head h2 {
    margin-top: 12px !important;
    font-size: clamp(48px, 7vw, 70px) !important;
  }

  .contact-section-head p {
    font-size: clamp(16px, 1.15vw, 19px) !important;
    line-height: 1.55 !important;
  }

  .standalone-contact-panel {
    padding-bottom: 24px !important;
    grid-template-columns: repeat(6, 68px) !important;
    column-gap: clamp(18px, 4vw, 48px) !important;
  }

  .standalone-contact-panel .contact-list {
    width: 100% !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin-bottom: 52px !important;
    padding-bottom: 60px !important;
  }

  .standalone-contact-panel .contact-list::before {
    width: 410px;
  }

  .standalone-contact-panel .contact-list::after {
    bottom: -16px;
    width: 48px;
    height: 32px;
    font-size: 25px;
  }

  .standalone-contact-panel .contact-item {
    min-height: 235px !important;
    padding: 22px 28px !important;
    gap: 12px !important;
  }

  .standalone-contact-panel .contact-item:nth-child(2) { border-right: 0 !important; }
  .standalone-contact-panel .contact-item:nth-child(-n+2) {
    border-bottom: 1px solid rgba(216,185,93,.16) !important;
  }

  .standalone-contact-panel .contact-item > div:first-child {
    width: 86px !important;
    height: 86px !important;
    flex-basis: 86px !important;
  }

  .standalone-contact-panel .contact-item > div:first-child::before {
    width: 37px;
    height: 37px;
  }

  .standalone-contact-panel .contact-item strong {
    font-size: 21px !important;
  }

  .standalone-contact-panel .contact-item span,
  .standalone-contact-panel .contact-item span a {
    font-size: 15.5px !important;
    line-height: 1.55 !important;
  }

  .standalone-contact-panel > div[style*="display:flex"] > a,
  .standalone-contact-panel .social-link {
    width: 68px !important;
    height: 68px !important;
    min-width: 68px !important;
    min-height: 68px !important;
    margin: 18px 0 50px !important;
  }

  .standalone-contact-panel .social-link svg {
    width: 29px !important;
    height: 29px !important;
  }

  .standalone-contact-panel a[href*="google.com/maps"]::before {
    width: 45px;
    height: 45px;
  }

  .standalone-contact-panel a[href*="wa.me"]::before {
    width: 46px;
    height: 46px;
  }

  .standalone-contact-panel > div[style*="display:flex"] > a::after,
  .standalone-contact-panel .social-link::after {
    top: calc(100% + 13px);
    font-size: 14.5px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  .brand-logo {
    width: 54px !important;
    height: 54px !important;
  }

  .cta {
    min-height: 260px;
    background-position: center;
  }

  main > section:last-of-type { padding-bottom: 24px; }

  section.contact-section#contact {
    padding: 46px 0 58px !important;
  }

  .contact-section-inner {
    width: calc(100% - 34px) !important;
  }

  .contact-section-head {
    display: block !important;
    margin-bottom: 32px !important;
  }

  .contact-section-head h2 {
    font-size: clamp(42px, 13vw, 58px) !important;
    white-space: normal;
  }

  .contact-section-head p {
    margin-top: 18px !important;
    font-size: 14px !important;
  }

  .standalone-contact-panel .contact-list {
    grid-template-columns: 1fr !important;
    padding-bottom: 42px !important;
    margin-bottom: 38px !important;
  }

  .standalone-contact-panel .contact-item {
    min-height: auto !important;
    padding: 21px 10px !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(216,185,93,.15) !important;
  }

  .standalone-contact-panel .contact-item:last-child { border-bottom: 0 !important; }

  .standalone-contact-panel .contact-item > div:first-child {
    width: 58px !important;
    height: 58px !important;
    flex-basis: 58px !important;
  }

  .standalone-contact-panel .contact-item > div:first-child::before {
    width: 27px;
    height: 27px;
  }

  .standalone-contact-panel {
    grid-template-columns: repeat(3, 58px) !important;
    column-gap: 40px !important;
    row-gap: 48px !important;
  }

  .standalone-contact-panel > div[style*="display:flex"] > a,
  .standalone-contact-panel .social-link {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    min-height: 58px !important;
    margin: 8px 0 27px !important;
  }

  .standalone-contact-panel .social-link svg {
    width: 25px !important;
    height: 25px !important;
  }

  .standalone-contact-panel a[href*="google.com/maps"]::before,
  .standalone-contact-panel a[href*="wa.me"]::before {
    width: 28px;
    height: 28px;
  }

  .standalone-contact-panel > div[style*="display:flex"] > a::after,
  .standalone-contact-panel .social-link::after {
    font-size: 10px;
    top: calc(100% + 8px);
  }

  .standalone-contact-panel .contact-list::before { width: 240px; }
}