/*
  Telefoncular desktop compatibility layer
  Keeps the desktop composition intact on common 1280–1599 CSS-pixel laptop viewports,
  including MacBook Retina displays. Layout decisions are viewport-based, not OS-based.
*/

html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

img,
video,
svg,
canvas,
iframe {
  max-width: 100%;
}

img[loading="lazy"]:not([width]) {
  aspect-ratio: 4 / 3;
  height: auto;
}

.gsap-fade,
.banner-card,
[data-hero-fade],
.reveal {
  opacity: 1;
  visibility: visible;
}

/* Absolute-fill hero videos must not shrink under the global video max-width rule (Safari/laptop) */
.home-hero__video:not(.home-hero__video--youtube),
.service-hero .hero-video,
.hero-knockout-video {
  max-width: none;
  width: 100%;
  height: 100%;
}

/* YouTube iframes keep 16:9 cover sizing (width/height 100% leaves letterbox gaps) */
.home-hero__video--youtube,
.hero-video-iframe,
.hero-knockout-iframe {
  max-width: none !important;
}

@media (min-width: 1100px) and (max-width: 1599px) {
  :root {
    --nav-pad-y: clamp(14px, 1.45vw, 20px);
    --nav-logo-h: clamp(35px, 2.7vw, 42px);
    --header-h: calc(var(--nav-pad-y) * 2 + var(--nav-logo-h));
    --nav-pad: var(--nav-pad-y) clamp(16px, 1.75vw, 28px);
    --container: min(1500px, calc(100% - 2rem));
    --pad: clamp(5.75rem, 9vw, 8.5rem);
  }

  .container,
  .wrap {
    max-width: calc(100% - 2rem);
  }

  .site-nav {
    padding: var(--nav-pad);
    gap: clamp(5px, 0.65vw, 10px);
  }

  .site-nav-logo img {
    height: var(--nav-logo-h);
  }

  .site-nav:not(.site-nav--service) .site-nav-logo {
    padding-right: clamp(10px, 0.9vw, 15px);
  }

  .site-nav-links {
    gap: clamp(2px, 0.35vw, 6px);
    padding-left: 2px;
  }

  .site-nav-links a,
  .site-nav-links .nav-link,
  .site-nav-links .nav-label,
  .site-nav-links .nav-trigger {
    font-size: 18px;
    letter-spacing: 0;
    padding: 0.48em 0.55em;
  }

  .site-nav-end {
    gap: clamp(5px, 0.55vw, 9px);
  }

  .site-nav-lang {
    gap: 4px;
    padding-inline: 3px;
    font-size: clamp(0.92rem, 1vw, 1rem);
  }

  .site-nav-lang img {
    width: 19px;
  }

  .site-nav .site-nav__btn--cta {
    min-height: 40px;
    padding: 0.58rem 0.78rem;
    font-size: 0.98rem;
    white-space: nowrap;
  }

  .site-nav--service {
    /* absolute kalsın — relative sayfayı alta iter */
    position: absolute;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    padding: var(--nav-pad);
    gap: clamp(4px, 0.55vw, 9px);
  }

  .site-nav--service:not(.is-scrolled):not(.is-mega-open) {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .site-nav--service .site-nav-links--service-left {
    grid-column: 1;
    justify-content: flex-start;
    min-width: 0;
  }

  .site-nav--service .site-nav-logo--service {
    grid-column: 2;
    position: static;
    inset: auto;
    transform: none;
    justify-self: center;
    align-self: center;
    width: max-content;
    max-width: 100%;
    padding: 0;
    border: 0;
    overflow: hidden;
    isolation: isolate;
    contain: paint;
  }

  .site-nav--service .site-nav-links--service-right {
    grid-column: 3;
    justify-content: flex-end;
    min-width: 0;
    margin-left: 0;
    /* Bayrak + Teklif Al için yer; sağ menü sola kayar */
    padding-right: clamp(148px, 16vw, 200px);
  }

  .site-nav--service .site-nav-end {
    position: absolute;
    top: var(--nav-pad-y);
    right: clamp(16px, 1.75vw, 28px);
    transform: none;
    height: var(--nav-logo-h);
    min-height: var(--nav-logo-h);
    display: flex !important;
    align-items: center;
    gap: clamp(5px, 0.55vw, 9px);
    margin: 0;
    z-index: 3;
  }

  .site-nav--service .site-nav-links a,
  .site-nav--service .site-nav-links .nav-link,
  .site-nav--service .site-nav-links .nav-label,
  .site-nav--service .site-nav-links .nav-trigger,
  .site-nav--service .site-nav-lang {
    font-size: 18px;
    letter-spacing: 0;
    text-shadow: none !important;
  }

  .site-nav--service .site-nav-links a,
  .site-nav--service .site-nav-links .nav-link,
  .site-nav--service .site-nav-links .nav-label,
  .site-nav--service .site-nav-links .nav-trigger {
    padding-inline: 0.5em;
  }

  /* Mega açık: anasayfa ile aynı — absolute overlay + clip-path shell */
  .site-nav.site-nav--service.is-mega-open {
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: center;
    grid-template-columns: none;
    overflow: hidden;
    clip-path: var(--clip-section-bottom);
    -webkit-clip-path: var(--clip-section-bottom);
    padding-bottom: calc(20px + var(--nav-mega-notch-rise, clamp(11px, 1.85vw, 26px)));
    border-bottom: none;
    z-index: 120;
  }

  .site-nav.site-nav--service.is-mega-open > .site-nav-links--service-left,
  .site-nav.site-nav--service.is-mega-open > .site-nav-links--service-right {
    grid-column: auto;
  }

  .site-nav.site-nav--service.is-mega-open > .site-nav-logo--service {
    position: absolute;
    top: var(--nav-pad-y);
    left: 50%;
    transform: translateX(-50%);
    grid-column: auto;
    justify-self: auto;
    z-index: 2;
    width: max-content;
  }

  .site-nav.site-nav--service.is-mega-open > .site-nav-links--service-right {
    margin-left: auto;
    padding-right: clamp(148px, 16vw, 200px);
  }

  .site-nav.site-nav--service.is-mega-open > .site-nav-end {
    position: absolute;
    top: var(--nav-pad-y);
    right: clamp(16px, 1.75vw, 28px);
    transform: none;
    height: var(--nav-logo-h);
    min-height: var(--nav-logo-h);
    align-items: center;
    z-index: 3;
  }

  .site-nav.site-nav--service.is-mega-open > .nav-mega-panel.is-visible,
  .site-nav.site-nav--service.is-mega-open > .nav-mega-panel.is-mega-animating,
  .site-nav.site-nav--service.is-mega-open > .nav-mega-panel.is-mega-closing {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    flex: 0 0 100%;
    width: 100%;
    order: 10;
    padding: 0;
    margin-top: 0;
    transform: none;
    overflow: hidden;
  }

  .site-nav.site-nav--service.is-mega-open .nav-mega-panel__box {
    width: 100%;
    max-width: none;
    margin: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    clip-path: none;
    -webkit-clip-path: none;
    background: transparent !important;
  }

  .site-nav.site-nav--service.is-mega-open .site-nav-links .nav-label,
  .site-nav.site-nav--service.is-mega-open .site-nav-links .nav-link,
  .site-nav.site-nav--service.is-mega-open .site-nav-links .nav-trigger,
  .site-nav.site-nav--service.is-mega-open .site-nav-lang {
    color: var(--brand, #113859) !important;
    text-shadow: none !important;
  }

  .home-hero__stage,
  .service-hero,
  main > section {
    min-width: 0;
  }

  .service-hero,
  .service-hero .hero-content {
    min-height: 85vh;
    min-height: 85svh;
    height: 85vh;
    height: 85svh;
  }

  .home-hero__center,
  .hero-center,
  .section-intro,
  .section-head,
  .why-grid,
  .product-info,
  .product-visualization {
    min-width: 0;
  }
}

@media (min-width: 1100px) {
  /* MacBook / laptop: eng-process dikey nefes — --eng-pad-y */
  .page-home #muhendislik .eng-process__section {
    --eng-pad-y: clamp(5.75rem, 20vw, 11.5rem);
  }

  /* MacBook / laptop: eng-process kart konumları */
  #muhendislik .eng-process__card--1 {
    left: 33.1%;
    top: calc(var(--eng-stage-top) + 4rem);
  }

  #muhendislik .eng-process__card--2 {
    top: calc(var(--eng-stage-top) + 4rem);
  }

  #muhendislik .eng-process__card--3 {
    left: 17.4%;
  }

  #muhendislik .eng-process__card--4 {
    right: 20.5%;
    top: calc(var(--eng-stage-top) + 12rem);
  }

  #muhendislik .eng-process__card--5 {
    left: 5%;
    top: calc(var(--eng-stage-top) + 17rem);
  }

  #muhendislik .eng-process__card--6 {
    right: 5%;
    top: calc(var(--eng-stage-top) + 17rem);
  }

  /* TR mega menü: preview yüksekliği list-wrap ile eşit */
  .nav-mega-layout {
    align-items: stretch;
  }

  .nav-mega-preview {
    min-height: 0;
    height: auto;
    align-self: stretch;
  }

  .nav-mega-preview__inner,
  .nav-mega-flip {
    height: 100%;
  }

  /* Hakkımızda: görsel solda, yazı sağda — Grid, dikey ortalama + nefes */
  #hakkimizda #cards .card:nth-child(1) {
    height: auto;
    min-height: clamp(28rem, 40vw, 34rem);
  }

  #hakkimizda #cards .card:nth-child(1) .card__lift,
  #hakkimizda #cards .card:nth-child(1) .card__shell {
    height: 100%;
    min-height: inherit;
  }

  #hakkimizda #cards .card:nth-child(1) .card__content {
    display: grid;
    grid-template-columns: minmax(14rem, 42%) minmax(0, 1fr);
    grid-template-rows: 1fr auto auto auto auto 1fr;
    align-items: center;
    align-content: center;
    column-gap: clamp(2rem, 3.5vw, 3.5rem);
    row-gap: clamp(0.65rem, 1.2vw, 0.9rem);
    height: auto;
    min-height: inherit;
    overflow: hidden;
    padding-left: max(var(--clip-safe-left), var(--stack-card-pad-inline));
    padding-right: max(var(--clip-safe-right), var(--stack-card-pad-inline));
  }

  #hakkimizda #cards .card:nth-child(1) .card__media {
    grid-column: 1;
    grid-row: 1 / -1;
    position: relative;
    left: auto;
    top: auto;
    transform: none;
    width: 100%;
    z-index: 1;
    align-self: center;
  }

  #hakkimizda #cards .card:nth-child(1) .card__content > h2,
  #hakkimizda #cards .card:nth-child(1) .card__content > p {
    grid-column: 2;
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }

  #hakkimizda #cards .card:nth-child(1) .card__content > h2 {
    grid-row: 2;
    font-size: 52px;
    line-height: 1.12;
  }

  #hakkimizda #cards .card:nth-child(1) .card__content > p:nth-of-type(1) { grid-row: 3; }
  #hakkimizda #cards .card:nth-child(1) .card__content > p:nth-of-type(2) { grid-row: 4; }
  #hakkimizda #cards .card:nth-child(1) .card__content > p:nth-of-type(3) { grid-row: 5; }

  #hakkimizda #cards .card:nth-child(1) .card__content p {
    font-size: 22px;
    line-height: 1.6;
  }
}

@media (min-width: 1100px) and (max-width: 1359px) {
  .site-nav {
    --nav-pad-y: 13px;
    --nav-logo-h: 34px;
    --nav-pad: var(--nav-pad-y) 14px;
  }

  .site-nav-links a,
  .site-nav-links .nav-link,
  .site-nav-links .nav-label,
  .site-nav-links .nav-trigger {
    font-size: 18px;
    letter-spacing: 0;
    padding-inline: 0.48em;
  }

  .site-nav:not(.site-nav--service) .site-nav-end .site-nav__btn--cta {
    padding-inline: 0.62rem;
    font-size: 0.9rem;
  }

  .site-nav--service .site-nav-links--service-right {
    padding-right: 150px;
  }

  .site-nav--service .site-nav-end {
    top: var(--nav-pad-y);
    right: 14px;
    transform: none;
    height: var(--nav-logo-h);
    align-items: center;
  }

  .site-nav--service .site-nav-lang {
    display: none;
  }

  .site-nav--service .site-nav__btn--cta {
    padding-inline: 0.6rem;
    font-size: 0.88rem;
  }

  .site-nav.site-nav--service.is-mega-open > .site-nav-links--service-right {
    padding-right: 150px;
  }

  .site-nav.site-nav--service.is-mega-open > .site-nav-end {
    top: var(--nav-pad-y);
    right: 14px;
  }

  #hakkimizda #cards .card:nth-child(1) .card__content {
    grid-template-columns: minmax(12rem, 40%) minmax(0, 1fr);
  }
}

@media (min-width: 1600px) {
  .site-nav--service .site-nav-end {
    display: flex;
  }
}

.page-iletisim .contact-location {
  min-height: clamp(12rem, 22vw, 13.75rem);
}

.page-iletisim .contact-location__face--front {
  padding-bottom: clamp(1.65rem, 2.5vw, 2rem);
}

@media (min-width: 1100px) {
  .page-sub .site-nav-end:has(.site-nav-lang-picker) {
    display: flex !important;
    margin-left: auto;
  }

  .page-sub .site-nav-lang-picker {
    display: block;
  }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .site-nav.is-scrolled {
    background: #ffffff;
  }

  .site-nav:not(.is-scrolled):not(.is-mega-open) .menu-btn {
    background: rgba(7, 21, 32, 0.92);
  }

  .footer-glass,
  .gallery-lightbox,
  .video-modal,
  .video-modal-box {
    background: rgba(7, 21, 32, 0.96);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

.yt-fallback {
  display: none;
  position: absolute;
  inset: 0;
  z-index: 2;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 1rem;
  background: #071520;
}

.yt-fallback img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
}

.yt-fallback__btn {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  padding: 0.75rem 1.25rem;
  background: #fff;
  color: #113859;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
}

.is-yt-fallback .yt-fallback {
  display: flex;
}

.hero-knockout-poster {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.hero-knockout-poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* infinity metric size + alignment */
.hero-metrics-row .hero-metric:has(.hero-metric__infinity) {
  position: relative;
  top: 5px;
}
.hero-metrics-row .hero-metric strong:has(.hero-metric__infinity) {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  min-height: 50px;
  line-height: 1;
}
.hero-metrics-row .hero-metric strong .hero-metric__infinity {
  font-family: "Poppins", sans-serif;
  font-weight: 300;
  font-style: italic;
  font-synthesis: none;
  font-size: 50px !important;
  line-height: 1;
  display: block;
  margin: 0 !important;
  letter-spacing: 0;
  text-transform: none;
  color: inherit;
}

/* infinity metric mobile: titles on the same line as Malzeme Kalınlığı, tighter gap, then 5px down */
@media (max-width: 1100px) {
  .hero-metrics.hero-metrics-row {
    align-items: start;
  }
  .hero-metrics-row .hero-metric:has(.hero-metric__infinity) {
    top: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .hero-metrics-row .hero-metric:has(.hero-metric__infinity) > span {
    width: 100%;
    text-align: center;
    margin: 0 0 2px !important;
  }
  .hero-metrics-row .hero-metric strong:has(.hero-metric__infinity) {
    width: 100%;
    justify-content: center;
    align-items: center;
    min-height: 0;
  }
  .hero-metrics-row .hero-metric strong .hero-metric__infinity {
    margin: -6px 0 0 !important;
  }
}


/* impact infinity glyph: Poppins Light Italic, inherit counter size */
.home-impact__value .home-impact__infinity {
  font-family: "Poppins", sans-serif;
  font-weight: 300;
  font-style: italic;
  font-synthesis: none;
  font-size: 1em;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  color: inherit;
}

html.is-macos .cap-acc__panel .cap-acc__title {
    font-size: 30px;
    line-height: 1.2em;
}
html.is-macos .cap-acc__panel .cap-acc__desc {
    font-size: 18px;
}

/* DE footer: hyphenate long service labels on mobile so they do not overlap the next column */
.footer-de-hyphen,
.footer-de-br {
  display: none;
}
.footer-col--services .footer-col__links a {
  max-width: 100%;
  box-sizing: border-box;
}
@media (max-width: 900px) {
  html[lang="de"] .footer-col--services .footer-de-hyphen {
    display: inline;
  }
  html[lang="de"] .footer-col--services .footer-de-br {
    display: block;
  }
}

/* Service detail mobile hero title: full width, 2.50rem — all locales */
@media (max-width: 820px) {
  .page-service-detail .hero-center .sr-only {
    max-width: 100%;
    font-size: 2.50rem;
  }
}