/* ============================================================
   Equitaurion — Custom overrides for Agency template
   ============================================================ */

/* #3 Professional font: Sora with kerning & rendering */
body, h1, h2, h3, h4, h5, h6, .btn, input, textarea, select {
  font-family: 'Sora', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-feature-settings: "kern" 1, "liga" 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4, h5, h6 { letter-spacing: -0.02em; }
p, li, span, a, div { letter-spacing: -0.005em; }

/* Brand colors */
:root {
  --eq-primary: #fed136;
  --eq-dark: #212529;
}

/* Override primary color to gold/amber */
.btn-primary { background-color: var(--eq-primary); border-color: var(--eq-primary); color: #212529; }
.btn-primary:hover, .btn-primary:active, .btn-primary:focus {
  background-color: #f5c518; border-color: #f5c518; color: #212529;
}
.text-primary { color: var(--eq-primary) !important; }
.btn-xl { font-size: 1rem; padding: 1.1rem 2.2rem; font-weight: 600; letter-spacing: .03em; }

/* #1 Navbar scroll fix — solid white bg on scroll, no content overlap */
#mainNav { 
  transition: padding .3s, background-color .3s, box-shadow .3s; 
  z-index: 1030;
}
/* Contact page navbar - always has background since no masthead image */
body:has(#contact) #mainNav:not(.navbar-shrink) {
  background-color: rgba(26,26,46,.95) !important;
  backdrop-filter: blur(8px);
  box-shadow: 0 2px 12px rgba(0,0,0,.2);
}
#mainNav.navbar-shrink {
  background-color: rgba(255,255,255,.98) !important;
  backdrop-filter: blur(10px);
  box-shadow: 0 2px 20px rgba(0,0,0,.1);
  padding-top: .5rem; padding-bottom: .5rem;
}
#mainNav.navbar-shrink .nav-link { color: #212529 !important; }
#mainNav.navbar-shrink .nav-link:hover { color: #d4a017 !important; }
#mainNav.navbar-shrink .nav-link.active { color: #212529 !important; font-weight: 600; }

/* Masthead — override template default bg */
header.masthead {
  background-image: url('../images/624ad2fd8d1c41971aacf8ba/629b5ab507d54ffd490bc51b_bgnd.png') !important;
  background-color: #1a1a2e;
}

/* Page section spacing */
.page-section { padding: 5rem 0; background: #fff; color: #212529; }
.page-section h2.section-heading { font-size: 2.2rem; margin-top: .5rem; margin-bottom: .5rem; color: #212529; font-weight: 700; }
.page-section h3.section-subheading { font-weight: 400; color: #6c757d; }
.page-section h4 { color: #212529; }
.page-section p { color: #6c757d; }
.page-section .text-muted { color: #6c757d !important; }

/* Navbar brand logo */
#mainNav .navbar-brand { padding: 0; }
#mainNav .navbar-brand img { height: 44px; filter: brightness(1.2); }
.brand-info { display: inline-flex; flex-direction: column; justify-content: center; vertical-align: middle; margin-left: 14px; line-height: 1.15; gap: 1px; }
.brand-info .brand-name { font-size: 15.5px; font-weight: 800; color: #fff; display: block; letter-spacing: 0.14em; text-transform: uppercase; text-shadow: 0 2px 4px rgba(0,0,0,.5); }
.brand-info .brand-tagline { font-size: 10px; color: rgba(255,255,255,.7); display: block; letter-spacing: 0.04em; text-shadow: 0 1px 3px rgba(0,0,0,.6); font-weight: 400; }
.brand-info .brand-tagline strong { font-weight: 700; color: var(--eq-primary); text-shadow: 0 1px 3px rgba(0,0,0,.6); }
.brand-info .brand-sub { font-size: 8.5px; color: rgba(255,255,255,.45); text-transform: uppercase; letter-spacing: 0.18em; display: block; margin-top: 2px; text-shadow: 0 1px 2px rgba(0,0,0,.5); font-weight: 500; }
#mainNav.navbar-shrink .brand-info .brand-name { color: #212529; text-shadow: none; }
#mainNav.navbar-shrink .brand-info .brand-tagline { color: #6c757d; text-shadow: none; }
#mainNav.navbar-shrink .brand-info .brand-tagline strong { color: #d4a017; text-shadow: none; }
#mainNav.navbar-shrink .brand-info .brand-sub { color: #9ca3af; text-shadow: none; }
#mainNav.navbar-shrink .navbar-brand img { filter: none; }

/* #4 Service cards — dark text, not blue */
.service-card {
  border: 2px solid #e5e7eb;
  border-radius: 16px;
  padding: 2.5rem 2rem 2rem;
  text-align: center;
  transition: all .3s ease;
  background: #fff;
  height: 100%;
}
.service-card:hover {
  border-color: var(--eq-primary);
  box-shadow: 0 8px 24px rgba(254,209,54,.12);
  transform: translateY(-4px);
}
.service-card .service-icon-img {
  width: 90px; height: 90px;
  object-fit: contain;
  margin: 0 auto 1.25rem;
  display: block;
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.08);
  transition: transform .3s, box-shadow .3s, opacity .3s;
  padding: 8px;
  background: linear-gradient(135deg, rgba(255,255,255,.92) 0%, rgba(248,249,250,.88) 100%);
  opacity: 0.92;
}
.service-card:hover .service-icon-img {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,.12);
  opacity: 1;
}
.service-card h5 {
  font-size: .82rem;
  font-weight: 700;
  color: #374151;
  text-transform: uppercase;
  letter-spacing: .02em;
  line-height: 1.5;
  margin: 0;
}

/* #5 #6 Dark tech section — centered icons, no border-radius, smaller bracket text */
.tech-section {
  background: #1a1a2e;
  color: rgba(255,255,255,.85);
  padding: 5rem 0;
}
.tech-section h2 { color: #fff; }
.tech-section h3 { color: var(--eq-primary); font-weight: 700; font-size: 1.2rem; margin-bottom: 1.25rem; }
.tech-col-header { text-align: center; margin-bottom: 1.5rem; }
.tech-col-header .tech-img {
  width: 72px; height: 72px;
  object-fit: contain;
  display: block;
  margin: 0 auto 1rem;
  border-radius: 14px;
  box-shadow: 0 4px 16px rgba(254,209,54,.2), 0 2px 6px rgba(0,0,0,.15);
  padding: 6px;
  background: rgba(255,255,255,.05);
  opacity: 0.9;
  transition: opacity .3s;
}
.tech-col-header:hover .tech-img {
  opacity: 1;
}
.tech-list {
  list-style: none; padding: 0; margin: 0;
  columns: 2;
  column-gap: 1.5rem;
}
.tech-list li {
  padding: 5px 0; font-size: .86rem;
  color: rgba(255,255,255,.65);
}
.tech-list li::before {
  content: '\2713'; color: var(--eq-primary);
  font-weight: 700; margin-right: 8px;
}
.tech-list .bracket { font-size: .72rem; color: rgba(255,255,255,.4); }
@media (max-width: 576px) {
  .tech-list { grid-template-columns: 1fr; }
}

/* #9 #10 Projects page — collection items grid, click overlay, shadows */
.collection-list-wrapper, .w-dyn-list { display: block; }
.collection-list, .w-dyn-items {
  display: flex !important; flex-wrap: wrap !important;
  gap: 14px !important; justify-content: center !important;
  list-style: none !important; padding: 0 !important; margin: 0 !important;
}
.collection-item, .w-dyn-item {
  width: 300px; height: 300px;
  border-radius: 10px;
  background-color: #fff;
  background-size: 85% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border: 1px solid #e9ecef;
  position: relative; overflow: hidden;
  transition: all .3s ease;
  cursor: pointer;
  box-shadow: 0 2px 12px rgba(0,0,0,.07);
  display: flex; flex-direction: column; justify-content: flex-end;
}
.collection-item:hover {
  box-shadow: 0 8px 30px rgba(0,0,0,.13);
  transform: translateY(-3px);
  z-index: 10;
}
/* #9 Hide title text in boxes — shown only in overlay */
.collection-item .link-4, .collection-item a[data-title] {
  display: none !important;
}
/* #9 Overlay on click (toggled via JS) */
.collection-item .tooltip, .collection-item a.tooltip {
  display: none; position: absolute; inset: 0;
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border-radius: 12px;
  padding: 24px 20px;
  box-shadow: 0 8px 32px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.08);
  z-index: 100; text-align: center; white-space: normal;
  flex-direction: column; justify-content: center; align-items: center;
  min-width: auto; max-width: none;
  transform: none; left: 0; bottom: 0;
  border: 3px solid var(--eq-primary);
  backdrop-filter: blur(8px);
}
.collection-item .tooltip.is-active,
.collection-item a.tooltip.is-active {
  display: flex !important;
  opacity: 1 !important;
  animation: fadeInScale 0.2s ease-out;
}
@keyframes fadeInScale {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}
.collection-item .text-block {
  font-size: .88rem;
  color: #374151;
  line-height: 1.6;
  margin-bottom: 16px;
  font-weight: 500;
  padding: 0 8px;
}
.collection-item .text-block-2 {
  display: inline-block;
  font-size: .8rem;
  font-weight: 600;
  color: #fff;
  background: #2563eb;
  padding: 8px 16px;
  border-radius: 6px;
  margin-top: 12px;
  transition: all .2s;
  text-decoration: none;
}
.collection-item .text-block-2:hover {
  background: #1d4ed8;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(37,99,235,.3);
}
.collection-item .text-block-2-copy {
  display: inline-block;
  font-size: .8rem;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  padding: 10px 20px;
  border-radius: 6px;
  margin-top: 8px;
  cursor: pointer;
  transition: all .2s;
  box-shadow: 0 2px 8px rgba(245,158,11,.3);
}
.collection-item .text-block-2-copy:hover {
  background: linear-gradient(135deg, #d97706 0%, #b45309 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(245,158,11,.4);
}
.bold-text-17 { color: #fff !important; font-weight: 700; }
.collection-item .price {
  font-size: .9rem;
  font-weight: 700;
  color: #10b981;
  margin-top: 12px;
  margin-bottom: 4px;
  padding: 6px 12px;
  background: rgba(16,185,129,.1);
  border-radius: 6px;
  display: inline-block;
}
.price::before { content: 'od '; }
.price::after { content: ' €'; }
.collection-item .type, .w-condition-invisible { display: none !important; }

@media (max-width: 1200px) {
  .collection-item, .w-dyn-item { width: 240px; height: 240px; }
}
@media (max-width: 992px) {
  .collection-item, .w-dyn-item { width: 200px; height: 200px; }
}
@media (max-width: 768px) {
  .collection-item, .w-dyn-item { width: 160px; height: 160px; }
  .collection-list, .w-dyn-items { gap: 10px !important; }
}
@media (max-width: 480px) {
  .collection-item, .w-dyn-item { width: 105px; height: 105px; }
  .collection-list, .w-dyn-items { gap: 8px !important; }
  .collection-item .tooltip { padding: 12px 10px; }
  .collection-item .text-block { font-size: .72rem; margin-bottom: 8px; padding: 0 4px; }
  .collection-item .text-block-2, .collection-item .text-block-2-copy { font-size: .7rem; padding: 6px 10px; }
  .collection-item .price { font-size: .75rem; padding: 4px 8px; }
  .collection-item .text-block { font-size: .7rem; margin-bottom: 4px; }
}

/* Search bar in header */
.search-wrap { max-width: 460px; margin: 1.5rem auto 0; }
.search-wrap input {
  width: 100%; padding: 13px 20px;
  font-size: 14px; font-family: inherit;
  border: 2px solid rgba(255,255,255,.25);
  border-radius: 50px;
  background: rgba(255,255,255,.1);
  color: #fff; backdrop-filter: blur(8px);
  transition: all .2s; outline: none;
}
.search-wrap input::placeholder { color: rgba(255,255,255,.5); }
.search-wrap input:focus { border-color: var(--eq-primary); background: rgba(255,255,255,.15); }

/* Contact page — map */
.contact-map { margin-top: 72px; border-bottom: 3px solid var(--eq-primary); overflow: hidden; }
.contact-map iframe { display: block; width: 100%; height: 340px; border: 0; }

/* Contact heading */
section#contact .section-heading { text-transform: none !important; font-size: 2rem; }

/* Contact info cards */
.contact-info-card {
  text-align: center; padding: 2rem 1rem;
  color: #212529;
}
.contact-info-card .fa-stack { margin-bottom: .75rem; }
.contact-info-card h6 { font-weight: 700; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: #212529; }
.contact-info-card h6 a { color: #212529; text-decoration: none; }
.contact-info-card h6 a:hover { color: #d4a017; }
.contact-info-card p { font-size: .86rem; color: #6c757d; margin: 0; }

/* Info note */
.info-note {
  background: #f8f9fa; border: 1px solid #e5e7eb;
  border-radius: 12px; padding: 0;
  text-align: center; font-size: .86rem; color: #6c757d;
  max-width: 640px; margin: 2rem auto;
  overflow: hidden;
}
.info-note a { color: #212529; font-weight: 600; }
.info-note-hours {
  padding: 1rem 1.5rem;
  border-bottom: 1px solid #e5e7eb;
  font-size: .88rem;
  color: #374151;
  font-weight: 500;
}
.info-note-hours i { color: var(--eq-primary); margin-right: 8px; }
.info-note-pricing {
  display: flex;
}
.info-price-item {
  flex: 1;
  padding: 1.1rem 1.25rem;
  text-align: center;
}
.info-price-item + .info-price-item {
  border-left: 1px solid #e5e7eb;
}
.info-price-item i {
  display: block;
  font-size: 1.15rem;
  color: var(--eq-primary);
  margin-bottom: .4rem;
}
.info-price-label {
  display: block;
  font-size: .76rem;
  color: #6c757d;
  margin-bottom: .3rem;
  letter-spacing: 0.01em;
}
.info-price-value {
  display: block;
  font-size: 1.15rem;
  font-weight: 700;
  color: #212529;
  letter-spacing: -0.01em;
}

/* Avatar — circular with full photo visible */
.contact-avatar {
  width: 140px; height: 140px;
  border-radius: 50%;
  object-fit: contain;
  background: #fff;
  border: 5px solid var(--eq-primary);
  box-shadow: 0 8px 30px rgba(254,209,54,.25), 0 4px 12px rgba(0,0,0,.15);
  padding: 8px;
  transition: transform .3s, box-shadow .3s;
}
.contact-avatar:hover {
  transform: scale(1.05);
  box-shadow: 0 12px 40px rgba(254,209,54,.3), 0 6px 16px rgba(0,0,0,.2);
}

/* Override Agency's dark #contact section */
section#contact {
  background-color: #fff !important;
  background-image: none !important;
}
section#contact .section-heading { color: #212529 !important; }
section#contact .section-subheading { color: #6c757d !important; }

/* #11 Privacy content card */
.privacy-card {
  max-width: 860px;
  margin: -3rem auto 0;
  position: relative;
  z-index: 2;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 24px rgba(0,0,0,.08);
  padding: 2.5rem 3rem 3rem;
}
@media (max-width: 768px) {
  .privacy-card { margin: -1.5rem 12px 0; padding: 1.5rem 1.25rem 2rem; }
}

/* #11 #12 Privacy policy content */
.privacy-content { max-width: 780px; margin: 0 auto; padding: 0; font-size: .92rem; line-height: 1.85; color: #374151; }
.privacy-content h2, .privacy-content .section-heading {
  font-size: 1.2rem; font-weight: 700;
  color: #212529; margin-top: 2rem; margin-bottom: .75rem;
  padding-bottom: .5rem; border-bottom: 2px solid #f1f3f5;
}
.privacy-content h3 { font-size: 1rem; font-weight: 600; color: #212529; margin-top: 1.5rem; margin-bottom: .5rem; }
.privacy-content p { margin-top: .75rem; margin-bottom: .75rem; }
.privacy-content a { color: #2563eb; text-decoration: underline; text-underline-offset: 2px; }
.privacy-content ul { padding-left: 20px; }
.privacy-content li { margin-bottom: 4px; }
.privacy-content .w-container, .privacy-content .w-richtext { max-width: 100%; padding: 0; margin: 0; }
.privacy-content .section-title-group { margin-bottom: 0; }
/* #10 Hide duplicate heading in yellow box */
.privacy-content .section-title-group .section-heading { display: none; }
.privacy-content .section-heading.centered { text-align: left; border-bottom: none; display: none; }
.privacy-content .section-subheading-copy { font-size: .92rem; color: #6c757d; margin-bottom: 1rem; }
.privacy-content .paragraph-3 { margin-bottom: 1rem; }
.privacy-content span[style*="color: red"], .privacy-content span[style*="color:red"],
.privacy-content strong[style*="color: red"], .privacy-content strong[style*="color:red"] {
  color: #dc3545 !important;
}
.privacy-content .w-container > .section-title-group {
  background: #f8f9fa; border-left: 4px solid var(--eq-primary);
  border-radius: 8px; padding: 1.25rem 1.5rem; margin-bottom: 1.5rem;
}

/* #7 #16 Footer — no headers, no slogan */
/* Footer positioning - always at bottom */
html { height: 100%; }
body { 
  min-height: 100vh; 
  margin: 0; 
  display: flex; 
  flex-direction: column; 
}
body > nav,
body > header,
body > div.contact-map,
body > section,
body > footer { flex-shrink: 0; }
body > section.page-section,
body > section#contact { flex: 1 0 auto; }
footer.footer { margin-top: auto; }
/* Remove FB widget container divs from flex layout */
body > script,
body > div.fb-share-button,
body > div.fb_iframe_widget,
body > div#fb-customer-chat {
  position: absolute !important;
  top: -9999px !important;
  left: -9999px !important;
}

footer.bg-dark { background: #111827 !important; }
.footer-col ul { list-style: none; padding: 0; margin: 0; }
.footer-col li { padding: 3px 0; }
.footer-col a { color: rgba(255,255,255,.5); text-decoration: none; transition: color .2s; font-size: .86rem; }
.footer-col a:hover { color: var(--eq-primary); }
.footer-divider { display: none; }

/* Mobile fixes */
@media (max-width: 768px) {
  header.masthead { padding-top: 8rem !important; padding-bottom: 3rem !important; }
  header.masthead .masthead-heading { font-size: 1.8rem !important; line-height: 2.1rem !important; margin-bottom: 1rem !important; }
  header.masthead .masthead-subheading { font-size: .95rem !important; line-height: 1.4rem !important; margin-bottom: .75rem !important; }
  .btn-xl { font-size: .9rem; padding: .8rem 1.4rem; }
  .page-section { padding: 3rem 0; }
  .tech-section { padding: 3rem 0; }
  section#contact .section-heading { font-size: 1.5rem; }
  .contact-info-card { padding: 1rem .5rem; }
  .info-note { font-size: .82rem; }
  .info-note-pricing { flex-direction: column; }
  .info-price-item + .info-price-item { border-left: none; border-top: 1px solid #e5e7eb; }
}
@media (max-width: 480px) {
  header.masthead .btn-xl { display: block; width: 100%; margin: .5rem 0 !important; }
}
