/* ============================================================
   EurAsix — custom overrides (loaded after main.css)
   Unified border-radius scale + header/hero transition fix
   ============================================================ */

:root {
  --r-lg: 20px;   /* cards, sections, large boxes */
  --r-md: 14px;   /* media, thumbnails, icon chips */
  --r-sm: 10px;   /* form inputs, small controls */
  --r-pill: 100px; /* buttons, badges, chips */
}

/* ---- Large cards / boxes ---- */
.brief-card,
.feature-card,
.service-item,
.contact-form-one,
.hero-images img,
.service-images,
.service-images img {
  border-radius: var(--r-lg) !important;
}

/* ---- Media & icon chips inside cards ---- */
.brief-issue-inner,
.brief-issue-thumb,
.brief-issue-cover,
.feature-icon {
  border-radius: var(--r-md) !important;
}

/* ---- Form controls ---- */
.form-input input,
.form-input textarea,
.contact-form-one input,
.contact-form-one textarea {
  border-radius: var(--r-sm) !important;
}

/* ---- Pills: buttons & badges ---- */
.tj-primary-btn,
.brief-btn,
.footer-subscribe-btn,
.brief-badge {
  border-radius: var(--r-pill) !important;
}

/* ============================================================
   Header ↔ hero transition
   Remove the hard divider line so the header blends into the
   (dark) hero instead of ending with a sharp cut.
   ============================================================ */
.tj-header-area.header-absolute,
.tj-header-area.header-absolute .header-bottom,
.tj-header-area.header-absolute .header-wrapper {
  border: 0 !important;
  box-shadow: none !important;
}

/* ============================================================
   About section — drop the grey panel and the small top image,
   keep the original left image.
   ============================================================ */
.tj-about-section::before {
  display: none !important;
}
.tj-about-section .about-bg-images .about-shape-2 {
  display: none !important;
}

/* ============================================================
   Hero: full-viewport (min 100vh) on desktop, content centred,
   with the animated scroll indicator pinned at the bottom.
   ============================================================ */
@media (min-width: 992px) {
  .tj-hero-section {
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding-top: 110px;   /* clear the absolute header */
    padding-bottom: 60px;
  }
  .tj-hero-section > .container {
    width: 100%;
  }
  .tj-hero-section .hero-content {
    padding-top: 0;       /* no longer needed — section is vertically centred */
  }
  /* keep the hero image from pushing the section past one screen */
  .tj-hero-section .hero-images-box {
    max-width: 560px;
  }
  .tj-hero-section .hero-images-box img {
    max-height: 74vh;
    width: 100%;
    object-fit: cover;
  }
  /* clean, straight seam between hero and the next section:
     drop the template's wavy white mask at the hero bottom */
  .tj-hero-section::before {
    display: none !important;
  }

  /* animated "scroll down" indicator, centred at the bottom */
  .tj-hero-section .hero_scroll {
    left: 50% !important;
    right: auto;
    bottom: 30px;
    transform: translateX(-50%) !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
  }
  .tj-hero-section .hero_scroll .down {
    flex-direction: column-reverse; /* "Scroll" on top, arrow below */
    align-items: center;
    gap: 10px;
    font-size: 12px;
    letter-spacing: 0.22em;
    color: var(--tj-color-common-white-2, rgba(255, 255, 255, 0.75));
  }
  .tj-hero-section .hero_scroll .down span {
    transform: none !important; /* undo the template's 90deg counter-rotate */
  }
  .tj-hero-section .hero_scroll .down span i {
    font-size: 18px;
    animation: scrollBounce 1.8s ease-in-out infinite;
  }
}

@keyframes scrollBounce {
  0%, 100% { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(7px); opacity: 0.45; }
}

/* ============================================================
   Privacy / Cookies policy pages — readable document layout
   ============================================================ */
.policy-section {
  padding-top: 70px;
  padding-bottom: 90px;
}
.policy-content {
  background: #fff;
  border: 1px solid rgba(5, 18, 41, 0.07);
  border-radius: var(--r-lg, 20px);
  padding: clamp(28px, 4vw, 56px);
  box-shadow: 0 22px 60px -40px rgba(5, 18, 41, 0.45);
  color: #364052;
  font-size: 16px;
  line-height: 1.8;
}
.policy-content .doc > :first-child,
.policy-content > :first-child {
  margin-top: 0 !important;
}
.policy-content h2 {
  font-size: 22px;
  line-height: 1.3;
  color: #051229;
  margin: 40px 0 16px !important;
  padding-top: 26px;
  border-top: 1px solid rgba(5, 18, 41, 0.08);
}
.policy-content h2:first-of-type {
  border-top: 0;
  padding-top: 0;
}
.policy-content p {
  margin-bottom: 16px;
}
.policy-content a {
  color: #0075ff;
  text-decoration: underline;
  word-break: break-word;
}
.policy-content b,
.policy-content strong {
  color: #051229;
}
.policy-content ul,
.policy-content ol {
  margin: 0 0 16px;
  padding-left: 22px;
}
.policy-content li {
  margin-bottom: 10px;
}
.policy-content i {
  color: #051229;
}
/* tables (cookie list) — the source markup uses .info-table */
.policy-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  font-size: 14px;
}
.policy-content th,
.policy-content td {
  border: 1px solid rgba(5, 18, 41, 0.12);
  padding: 12px 15px;
  text-align: left;
  vertical-align: top;
}
.policy-content th {
  background: #e1e8f0;
  color: #051229;
  font-weight: 700;
}
.policy-content tbody tr:nth-child(even) td {
  background: rgba(5, 18, 41, 0.025);
}

/* Policy/Cookies page header — clean brand gradient (no placeholder image) */
.tj-page-header {
  background: radial-gradient(120% 150% at 82% -20%, #0b2650 0%, #061634 48%, #030c1c 100%) !important;
}

/* Trim the oversized footer */
.footer-top-area {
  padding-top: 56px !important;
  padding-bottom: 44px !important;
}
.footer-copyright-area {
  padding: 20px 0 !important;
}