/* =========================================================
   Contact Page CSS (Compact, Flat, No Animations)
   File: assets/css/contact-us.css
   Scope: Only Contact page sections + page body class
   Notes:
   - No gradients
   - No animations/transitions
   - Compact spacing
   - Marketplace button: no background
========================================================= */

/* Base scope: keep this class on the contact page body */
body.body-bg-color{
  --dv-bg: #f6fbfa;
  --dv-surface: #ffffff;
  --dv-ink: #122423;
  --dv-muted: #5b6f6f;
  --dv-brand: #16a57a;   /* primary solid */
  --dv-brand-ink: #0b3b2f;
  --dv-line: rgba(16, 80, 68, 0.14);
  --dv-shadow: 0 10px 26px rgba(16,80,68,.12);
  --dv-shadow-md: 0 14px 32px rgba(16,80,68,.18);
  --dv-radius-lg: 20px;
  --dv-radius-md: 14px;
}

/* Page background */
body.body-bg-color{
  background: var(--dv-bg) !important;
  color: var(--dv-ink);
}

/* Ensure WOW hidden states don’t hide content (but we are removing animations anyway) */
.wow{ visibility: visible !important; opacity: 1 !important; }

/* Disable animations and transitions page-wide (Contact page only) */
html{ scroll-behavior: auto !important; }
body.body-bg-color *,
body.body-bg-color *::before,
body.body-bg-color *::after{
  animation: none !important;
  transition: none !important;
}

/* Avoid global link overrides; only scope inside contact sections */
.page-title-area a,
.contact-info-area a,
.contact-area a,
.subscribe-area a{ text-decoration: none; }

/* Images safe sizing within contact sections */
.page-title-area img,
.contact-info-area img,
.contact-area img,
.subscribe-area img{ max-width: 100%; height: auto; }

/* Containers (only for contact sections) */
.page-title-area .container,
.contact-info-area .container,
.contact-area .container,
.subscribe-area .container{
  max-width: 1180px;
}

/* Ensure navbar positioning matches corporate style (Top Header space) */
.navbar-area {
  top: 50px !important;
}

/* ===========================
   HERO / PAGE TITLE (compact)
=========================== */
.page-title-area{
  position: relative;
  padding: 90px 0 30px !important;
  background: #0f2a2e !important;
  overflow: hidden;
  margin-top: 0 !important;
  display: flex;
  align-items: center;
  min-height: auto !important;
}
.page-title-area::before,
.page-title-area::after{ content: none !important; }

.page-title-content{
  position: relative;
  z-index: 1;
  text-align: center;
  max-width: 820px;
  margin: 0 auto;
  padding: 0 16px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

.page-title-content h2{
  color: #fff !important;
  font-weight: 800 !important;
  font-size: clamp(32px, 5.5vw, 56px) !important;
  line-height: 1.15 !important;
  margin: 0 0 6px !important;
  letter-spacing: -0.02em;
  text-shadow: none;
}

/* Force white subtitle in hero */
.hero-subtitle{ color: #ffffff !important; }

.page-title-content ul{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0 !important;
  padding: 4px 12px !important;
  margin: 0 0 10px 0 !important;
  border-radius: 999px;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  backdrop-filter: blur(10px) !important;
}
.page-title-content ul li,
.page-title-content ul li a{
  color: rgba(255,255,255,.9) !important;
  font-size: 14px;
  font-weight: 600;
}
.page-title-content ul li.active{ color: #fff !important; }
.page-title-content ul li + li{
  position: relative;
  padding-left: 10px;
  margin-left: 6px;
}
.page-title-content ul li + li::before{
  content:"";
  position:absolute; left:0; top:50%;
  width:4px; height:4px; transform:translateY(-50%);
  border-radius:50%;
  background: rgba(255,255,255,.55);
}

/* ===========================
   CONTACT INFO (compact)
=========================== */
.contact-info-area{
  padding: 35px 0 55px !important;  /* less top space */
}

.info-content{
  background: var(--dv-surface);
  border: 1px solid var(--dv-line);
  border-radius: var(--dv-radius-lg);
  box-shadow: var(--dv-shadow);
  padding: 24px !important;
  position: relative;
  overflow: hidden;
}
.info-content::before{ content: none !important; }

.info-content h3{
  font-weight: 800;
  color: var(--dv-ink);
  margin: 0 0 14px;
  font-size: 20px;
  letter-spacing: .2px;
}

.info-content ul{
  list-style: none;
  padding: 0; margin: 0;
  display: grid;
  gap: 10px !important;
}

.info-content ul li{
  display: grid;
  grid-template-columns: 40px 1fr !important;
  align-items: start;
  gap: 10px !important;
  padding: 12px 14px !important;
  border-radius: 14px;
  border: 1px solid rgba(16,80,68,.12);
  background: rgba(41,184,139,.06);
}

.info-content ul li span{
  width: 40px !important; height: 40px !important;
  border-radius: 12px !important;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(41,184,139,.14);
  border: 1px solid rgba(41,184,139,.22);
  color: var(--dv-brand-ink);
  font-size: 16px !important;
}

.info-content ul li a{
  color: var(--dv-ink);
  font-weight: 650;
  line-height: 1.45;
}
.info-content ul li a:hover{ color: var(--dv-brand); }

/* ===========================
   CONTACT FORM (compact)
=========================== */
.contact-area{
  padding: 60px 0 !important;
}

.section-title{
  text-align: center;
  margin-bottom: 22px !important;
}
.section-title .top-title{
  display: inline-flex; align-items: center; gap: 8px;
  font-weight: 800; color: var(--dv-brand);
  background: rgba(41,184,139,.10);
  border: 1px solid rgba(41,184,139,.18);
  padding: 6px 12px; border-radius: 999px;
  font-size: 12px; text-transform: uppercase; letter-spacing: .8px;
}
.section-title h2{
  margin-top: 10px !important;
  font-weight: 900; color: var(--dv-ink);
  font-size: clamp(24px, 3vw, 34px);
  letter-spacing: .2px;
}

.contact-form{
  max-width: 900px; margin: 0 auto;
  background: var(--dv-surface);
  border: 1px solid var(--dv-line);
  border-radius: var(--dv-radius-lg);
  box-shadow: var(--dv-shadow-md);
  padding: 24px !important;
  position: relative; overflow: hidden;
}
.contact-form::before{ content: none !important; }

/* Status messages */
#form-status-message{ margin: 0 0 12px; }
#form-status-message p{
  margin: 0;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  font-weight: 700;
  background: rgba(41,184,139,.10);
  border: 1px solid rgba(41,184,139,.22);
  color: #065f46;
}

/* Form groups */
.contact-form .form-group{ margin-bottom: 12px !important; }

.contact-form label{
  display: block;
  font-weight: 800;
  color: var(--dv-ink);
  margin: 0 0 6px !important;
  font-size: 14px !important;
}

.form-control,
select.form-control,
textarea.form-control{
  width: 100%;
  border-radius: 12px !important;
  border: 2px solid rgba(16,80,68,.18) !important;
  background: #fff !important;
  padding: 10px 14px !important;
  height: 44px !important;
  color: var(--dv-ink);
  font-size: 14px !important;
  box-shadow: none !important;
}

textarea.form-control{
  height: auto; min-height: 120px !important; resize: vertical;
}

/* Checkbox terms */
.contact-form input[type="checkbox"]{
  transform: translateY(2px);
  margin-right: 8px;
  accent-color: var(--dv-brand);
}
.contact-form .form-group label[for="contactterms"]{
  font-weight: 650; font-size: 14px;
  color: var(--dv-muted); margin: 0; line-height: 1.55;
}
.contact-form .form-group label[for="contactterms"] a{
  color: var(--dv-brand); font-weight: 800;
}
.contact-form .form-group label[for="contactterms"] a:hover{
  color: var(--dv-brand-ink); text-decoration: underline;
}

/* Button (solid, compact) */
.default-btn{
  border: none !important;
  border-radius: 12px !important;
  padding: 10px 16px !important;
  font-weight: 900 !important;
  letter-spacing: .2px;
  background: var(--dv-brand) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(16,80,68,.20) !important;
  cursor: pointer;
}
.default-btn:hover{
  background: var(--dv-brand-ink) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 16px 32px rgba(16,80,68,.30) !important;
}

/* ===========================
   SUBSCRIBE / CTA (compact)
=========================== */
.subscribe-area{ padding: 50px 0 !important; }

.subscribe-bg{
  border-radius: var(--dv-radius-lg) !important;
  overflow: hidden; position: relative;
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: var(--dv-shadow);
  padding: 24px !important;
  background: #0d9488; /* solid */
}
.subscribe-bg::before{ content: none !important; }

.subscribe-content h2{
  font-weight: 900; letter-spacing: .2px; lineנסים: 1.25;
  color: #fff;
  font-size: clamp(22px, 3vw, 30px);
  margin: 0 0 6px;
}
.subscribe-content p{
  opacity: .95; font-weight: 600; color: rgba(255,255,255,.9);
  margin: 0;
}

.contact-btn.default-btn{
  border-radius: 999px !important;
  padding: 10px 18px !important;
  font-weight: 900 !important;
  background: #fff !important; color: #0d9488 !important;
}
.contact-btn.default-btn:hover{
  background: #f0fdfa !important;
  color: #0f766e !important;
  box-shadow: 0 6px 20px rgba(0,0,0,.15) !important;
}

/* ===========================
   FOOTER (compact for this page block)
=========================== */
.footer-area{ background: #f0fdfa; padding: 60px 0 30px !important; }
.single-footer-widget{ margin-bottom: 20px !important; }
.copy-right-area{ background: #f0fdfa; padding: 20px 0 !important; border-top: 1px solid rgba(41, 184, 139, 0.15); }

/* ===========================
   UTILITIES
=========================== */
.text-center{ text-align: center; }
.text-justify{ text-align: justify; }

/* Go Top button (unchanged behavior but flat) */
.go-top{
  position: fixed; bottom: 30px; right: 30px;
  width: 50px; height: 50px;
  background: #29b88b; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff; cursor: pointer;
  box-shadow: 0 8px 20px rgba(41,184,139,.4);
  z-index: 999; opacity: 0; visibility: hidden;
}
.go-top.active{ opacity: 1; visibility: visible; }

/* ===========================
   RESPONSIVE
=========================== */
@media (max-width: 991px){
  .page-title-area{ padding: 50px 0 30px !important; }
  .info-content{ padding: 20px !important; }
  .contact-form{ padding: 20px !important; }
}
@media (max-width: 575px){
  .page-title-content ul{ gap: 8px !important; padding: 7px 12px !important; }
  .info-content ul li{ grid-template-columns: 36px 1fr !important; padding: 10px 12px !important; }
  .default-btn{ width: 100%; }
}

/* Hide floating UI specific to this page */
.go-top,
.cookie-alert { display: none !important; }

/* Hide Marketplace link in footer (keep floating button only) */
.footer-area .help-link a[href*="shop"] { display: none !important; }
.footer-area .help-link li:has(a[href*="shop"]) { display: none !important; }