.hakkimizda-main {
  min-height: 100vh;
  padding-top: 90px;
  background: #ffffff;
}

.single-content-section {
  padding: 70px 0 20px;
}

.column-wrapper.single-content-section {
  /* mobile-first: stacked layout */
  width: 100%;
  z-index: 3;
  position: relative;
  padding: 40px 20px 0;
}

.column-image {
  /* default: flow with content for small screens */
  position: relative;
  width: 100%;
  z-index: 1;
  overflow: hidden;
}

.column-image .bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  filter: saturate(0.92) brightness(0.62);
}

.column-image .overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.22), rgba(0,0,0,0.5));
}

.column-image .column-title {
  position: absolute;
  bottom: 140px;
  left: 0;
  width: 100%;
  text-align: left;
  padding: 20px 50px;
  z-index: 11;
}

.column-image .column-title h2 {
  margin: 0;
  font-size: 48px;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: #fff;
  font-weight: 700;
  position: relative;
}

.column-image .column-title h2::before {
  content: '';
  position: absolute;
  left: 0;
  top: -70px;
  width: 40px;
  height: 2px;
  background: rgba(255,255,255,0.9);
}

.column-image .column-title h3 {
  font-family: "Playfair Display", serif;
  font-style: italic;
  color: rgba(255,255,255,0.91);
  max-width: 400px;
  font-size: 20px;
}

.fixed-column-dec {
  position: absolute;
  top: 50px;
  right: 50px;
  width: 70px;
  height: 70px;
  z-index: 21;
  border-top: 1px solid rgba(255,255,255,0.51);
  border-right: 1px solid rgba(255,255,255,0.51);
  border-bottom-color: rgba(255,255,255,0.51);
  border-left-color: rgba(255,255,255,0.51);
}

#sec1 {
  margin: 0 auto 80px;
  padding: 0;
}

.container.small-container {
  width: 100%;
  max-width: 1230px;
  margin: 0 auto;
}

.post.fl-wrap.fw-post {
  border: 1px solid #eeeeee;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.05);
  border-radius: 24px;
  padding: 30px;
  background: #fff;
  margin: 0 auto 50px;
  max-width: 1120px;
  width: 100%;
}

@media (max-width: 768px) {
  .post.fl-wrap.fw-post {
    padding: 20px;
    margin: 0 auto 30px;
    border-radius: 16px;
  }
}

@media (max-width: 480px) {
  .post.fl-wrap.fw-post {
    padding: 16px;
    margin: 0 auto 20px;
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.03);
  }
}

.section-title.fl-wrap {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 28px;
  border-bottom: 1px solid rgba(226, 226, 226, 0.75);
  padding-bottom: 22px;
  margin-bottom: 28px;
}

.section-title.fl-wrap h3,
.section-title.fl-wrap h4 {
  margin: 0;
}

.section-title.fl-wrap h3 {
  font-size: 1.35rem;
  line-height: 1.1;
  letter-spacing: -0.02em;
  font-weight: 700;
  text-transform: uppercase;
}

.section-title.fl-wrap h4 {
  color: #7c7c7c;
  font-size: 0.95rem;
  line-height: 1.75;
}

@media (max-width: 768px) {
  .section-title.fl-wrap {
    gap: 16px;
    padding-bottom: 16px;
    margin-bottom: 20px;
  }

  .section-title.fl-wrap h3 {
    font-size: 1.15rem;
  }

  .section-title.fl-wrap h4 {
    font-size: 0.85rem;
  }
}

@media (max-width: 480px) {
  .section-title.fl-wrap {
    flex-direction: column;
    gap: 8px;
    padding-bottom: 12px;
    margin-bottom: 16px;
  }

  .section-title.fl-wrap h3 {
    font-size: 1rem;
  }

  .section-title.fl-wrap h4 {
    font-size: 0.8rem;
  }
}

.section-number {
  margin-left: auto;
  font-size: 2.7rem;
  font-weight: 700;
  color: rgba(17, 17, 17, 0.24);
  min-width: 70px;
  text-align: right;
}

@media (max-width: 768px) {
  .section-number {
    font-size: 2rem;
    min-width: 50px;
  }
}

@media (max-width: 480px) {
  .section-number {
    display: none;
  }
}

.pr-det-container {
  display: grid;
  gap: 28px;
}

@media (max-width: 768px) {
  .pr-det-container {
    gap: 20px;
  }
}

@media (max-width: 480px) {
  .pr-det-container {
    gap: 16px;
  }
}

.pr-det-container p {
  margin: 0 0 1rem 0;
  line-height: 1.6;
  color: #333;
}

@media (max-width: 480px) {
  .pr-det-container p {
    font-size: 0.9rem;
    margin: 0 0 0.8rem 0;
  }
}

.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 30px;
}

.team-member {
  text-align: center;
  padding: 20px;
  background: #f9f9f9;
  border-radius: 12px;
  transition: transform 0.2s ease;
}

.team-member:hover {
  transform: translateY(-5px);
}

.team-photo {
  margin: 0 auto 15px;
  overflow: hidden;
}

.team-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-member h4 {
  margin: 0 0 5px 0;
  font-size: 1.1rem;
  font-weight: 600;
  color: #333;
}

.team-member p {
  margin: 0 0 10px 0;
  color: #7c7c7c;
  font-size: 0.9rem;
}

.team-member a {
  color: #333;
  font-size: 1.2rem;
  text-decoration: none;
}

.equipment-section h4 {
  margin: 1.5rem 0 0.5rem 0;
  font-size: 1.2rem;
  font-weight: 600;
  color: #333;
}

.equipment-section ul {
  margin: 0 0 1rem 0;
  padding-left: 1.5rem;
  list-style: disc;
}

.equipment-section li {
  margin-bottom: 0.5rem;
  color: #555;
}

@media (max-width: 1064px) {
  .column-wrapper.single-content-section {
    display: block;
    width: 100%;
    padding: 40px 50px 120px;
  }

  .column-image {
    position: relative;
    width: 100%;
    padding: 150px 0;
  }

  .fl-wrap.row {
    grid-template-columns: 1fr;
  }

  .container.small-container {
    padding: 0 20px;
  }
}

/* Desktop two-column grid layout */
@media (min-width: 1065px) {
  .column-wrapper.single-content-section {
    display: grid;
    grid-template-columns: 45% 55%;
    align-items: stretch;
    gap: 0;
    padding: 40px 60px 0;
  }

  .column-image {
    /* keep image visible while scrolling */
    position: sticky;
    top: 90px;
    width: 100%;
    height: calc(100vh - 90px);
    padding: 0;
    display: block;
  }

  .column-image .column-title {
    bottom: 140px;
    left: 30px;
    padding: 20px 40px;
  }
}

@media (max-width: 640px) {
  .fw-carousel .swiper-slide img, .fw-carousel .swiper-slide { display: block; width: 100% !important; height: auto !important; }
  .fw-carousel .swiper-wrapper { width: 100%; display: block; height: inherit !important; }
  .fsc-holder { padding: 10px; }
  .fw-carousel .swiper-container, .fw-carousel, .fw-carousel-wrap, .no-mob-hidden { height: auto !important; }
  .fw-carousel-wrap { position: relative; float: left; width: 100%; }
  .no-horizontal-slider { margin-bottom: 10px; text-align: center; display: block !important; }
  .no-horizontal-slider .swiper-slide { height: auto; margin-bottom: 10px; margin-left: 0px; margin-right: 0px; display: block !important; }
  .swiper-link-wrap { padding-right: 0px; padding-bottom: 90px; }
  .swiper-link { width: 100%; height: 70px; right: 0px; top: inherit; bottom: 0px; line-height: 70px; }
  .swiper-link span { position: relative; left: 0px; top: 0px; display: inline-block; white-space: normal; transform: rotate(0deg); }
  .swiper-link-wrap .thumb-info { right: 0px; bottom: 90px; }
  .search-input { position: absolute; left: 0px; top: 90px; padding: 0px 30px; margin: 0px; width: 100%; height: 70px; background: rgb(41, 41, 41); }
  .search-input::before, .search-input, .closedet_style, .column-notifer, .bottom-panel, .bottom-filter-wrap .scroll-down-wrap, .bottom-filter-wrap::before, .content-nav-fixed li a span strong, .section-number, .hero-slider_details_wrap, .thumbnail-container { display: none; }
  .search-input input { background: rgb(41, 41, 41); color: rgb(255, 255, 255); margin-top: 20px; border: none; }
  .search-input input::-webkit-input-placeholder { color: rgb(255, 255, 255); }
  .search-input input:focus { border-bottom: 1px solid rgb(41, 41, 41); }
  .search-button { float: right; display: block; width: 50px; position: relative; cursor: pointer; font-size: 16px; top: 34px; }
  .fix-pr-det, .fix-pr-det.hid-det { position: relative; top: 0px; bottom: inherit; z-index: 20; background: rgb(255, 255, 255); overflow: hidden; float: left; width: 100%; padding: 50px 20px 30px; transform: translate3d(0px, 0px, 0px); left: 0px !important; }
  .det-anim { transform: translateY(0px) !important; opacity: 1 !important; }
  .initscroll { position: relative; float: left; padding: 0px; }
  .column-wrapper { padding: 40px 10px 10px; }
  .serv-text, .serv-media, .policy-box { width: 100%; padding-left: 0px; }
  .serv-item { display: block; margin-bottom: 40px; }
  .serv-area { width: 100%; padding-left: 0px; padding-top: 15px; }
  section { padding: 50px 0px; }
  .to-top-btn { float: left; margin-top: 40px; }
  .follow-wrap, .home-main_title { padding-left: 50px; }
  .gallery-item { width: 100% !important; }
  .ff_panel-conainer { padding: 0px 0px 90px; }
  .bottom-filter-wrap { padding: 0px 10px; }
  .filter-title { top: 16px; }
  .column-title h2, .fs-slider_align_title h2 { font-size: 36px; line-height: 40px; padding-bottom: 12px; }
  .column-image { padding: 100px 0px; }
  .author-social { float: left; }
  .author-content { padding-left: 70px; }
  .author-img { top: 30px; }
  .author-img, .author-img img { width: 50px; height: 50px; }
  .inline-facts { width: 50%; }
  .home-slider-counter-wrap { left: 20px; }
  .home-main_container { left: 0px; right: 0px; bottom: 0px; }
  .fs-slider-det { padding-bottom: 0px; }
  .hero-slider_control-wrap { width: 100%; bottom: 50px; }
  .hero-slider_control_item { float: left; }
  .fs-slider_align_title { padding: 0px 30px; top: 34%; }
  .swiper-container { height: auto; }
  .column-title { padding: 20px; }
  .column-wrapper.single-content-section { padding: 0px 20px 120px; }
  .follow-wrap { top: 80px; }
  .fw-carousel .swiper-wrapper { transform: translate3d(0px, 0px, 0px) !important; }
  .fs-slider2 .swiper-container { height: auto; }
  .single-content-section .section-title h3 { font-size: 20px; }
}

/* Overlay + title responsive tweaks */
.column-image .overlay {
  pointer-events: none;
  transition: background 200ms ease, opacity 200ms ease;
}

@media (max-width: 768px) {
  .column-image {
    /* give more breathing room above the image content */
    min-height: 420px;
    padding: 140px 0 40px;
  }
  .column-image .overlay {
    background: linear-gradient(180deg, rgba(0,0,0,0.18) 15%, rgba(0,0,0,0.5) 85%);
  }
  /* Make the title flow normally on small screens so we can add spacing */
  .column-image .column-title {
    position: relative;
    bottom: auto;
    left: auto;
    width: 100%;
    padding: 20px 24px;
    margin: 12px 0;
    text-align: center;
    z-index: 11;
  }
  .column-image .column-title h2 {
    font-size: 36px;
    margin: 0;
  }
  .column-image .column-title h3 {
    font-size: 18px;
    max-width: 340px;
    margin: 8px auto 0;
  }
}

@media (max-width: 480px) {
  .column-image {
    min-height: 320px;
    padding: 110px 0 30px;
  }
  .column-image .overlay {
    background: linear-gradient(180deg, rgba(0,0,0,0.12) 10%, rgba(0,0,0,0.45) 90%);
  }
  .column-image .column-title {
    position: relative;
    bottom: auto;
    left: auto;
    padding: 14px 16px;
    margin: 10px 0;
    text-align: center;
    z-index: 11;
  }
  .column-image .column-title h2 {
    font-size: 26px;
    line-height: 1.08;
    margin: 0;
  }
  .column-image .column-title h3 {
    font-size: 14px;
    max-width: 100%;
    margin: 6px auto 0;
  }
}