/* Requested alignment and service-card corrections */
@media (min-width: 761px) {
  .nav nav {
    left: 50%;
    transform: translateX(-50%);
  }

  .logo {
    width: 150px;
  }

  .hero-copy {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .service-grid article:first-child {
    padding: 2.5rem;
    box-shadow: 0 0.75rem 1.5rem #0003;
  }

  .service-grid article:first-child .service-icon {
    background: #2b2b2b;
  }

  .service-grid article:first-child h3 {
    margin-top: 1.5rem;
  }
}

/* Hover and supplied social icons */
@media (min-width: 761px) {
  .service-grid article:first-child:hover {
    box-shadow: 0 0.9375rem 1.75rem #c70e1a30;
  }

  .service-grid article:hover .service-icon {
    background: var(--red);
  }
}

.linkedin-mark {
  padding: 0;
  border-radius: 0;
  background: none;
}

.linkedin-mark img {
  width: 100%;
  height: 100%;
}

.social a {
  padding: 0;
  background: none;
}

.social a img {
  width: 100%;
  height: 100%;
}

/* Shared button arrows: 30% shorter and optically centered. */
.btn b {
  position: relative;
  color: transparent;
  overflow: hidden;
}

.btn b::after {
  content: '→';
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #fff;
  line-height: 1;
  transform: scaleX(.7);
  transform-origin: center;
}


/* Header logo and exact centered arrow artwork. */
.logo img { width: 80%; }
.btn b { padding-right: 0; font-size: 0; }
.btn b::after { position: static; width: 70%; height: 70%; background: center / 100% 100% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M10 50H68M52 27l24 23-24 23' fill='none' stroke='white' stroke-width='10' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E"); transform: none; }


/* Shared call-to-action geometry. */
.btn, .header .btn, .hero .btn, .about-copy .btn, .awards .btn, .team .btn, .metrics-intro .btn, .contact .btn {
  width: fit-content !important;
  max-width: 100%;
  padding: 0 10px 0 15px !important;
  gap: 15px !important;
  justify-content: flex-start;
}
.btn b {
  position: relative;
  display: block;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  padding: 0;
  font-size: 0;
}
.btn b::after {
  content: '';
  position: absolute;
  inset: auto;
  left: 50%;
  top: 50%;
  width: 70%;
  height: 70%;
  display: block;
  background: center / 100% 100% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M10 50H68M52 27l24 23-24 23' fill='none' stroke='white' stroke-width='10' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");
  transform: translate(-50%, -50%);
}

/* Responsive layout and interactive brand carousel. */
html, body { overflow-x: hidden; }
.brand-logos {
  overflow-x: scroll;
  padding-left: 0;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
  scrollbar-width: none;
}
.brand-logos::-webkit-scrollbar { display: none; }
.brand-logos.is-dragging { cursor: grabbing; }
.brand-track { animation: none !important; }
.brand-logos img {
  filter: grayscale(1);
  opacity: .48;
  transition: filter .2s ease, opacity .2s ease, transform .2s ease;
}
.brand-logos img:hover,
.brand-logos img:focus-visible {
  filter: grayscale(0);
  opacity: 1;
  transform: scale(1.06);
}

@media (min-width: 761px) and (max-width: 1199px) {
  html { font-size: 12px; }
  .container, .works-inner, .insights > .container, .metrics-layout { width: calc(100% - 64px); margin-left: auto; margin-right: auto; }
  .header { height: 7rem; }
  .logo { width: 150px; }
  .nav nav { gap: 2.5rem; }
  .actions { gap: 1.5rem; }
  .hero-copy { width: min(56.25rem, calc(100% - 64px)); }
  .brands, .about, .services, .awards, .works, .numbers, .team, .insights, .contact { height: auto; min-height: 0; }
  .brands { padding: 6rem 0; }
  .brand-logos { height: 5.5rem; }
  .two-col { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; }
  .about { padding: 5rem 0 8rem; }
  .about-media { width: 100%; height: auto; aspect-ratio: 1 / 1; }
  .about-copy { padding-top: 1rem; }
  .services { padding: 5rem 0 7rem; }
  .services .intro { height: auto; margin-bottom: 4rem; }
  .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem; }
  .service-grid article { height: auto; min-height: 24rem; }
  .awards { padding: 6rem 0 8rem; }
  .award-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; margin-top: 3rem; }
  .award-grid figure, .award-grid img { width: 100%; height: auto; }
  .award-grid figure { aspect-ratio: 1 / 1.28; }
  .award-grid img { aspect-ratio: 1; }
  .works { padding: 7rem 0; }
  .works-inner { width: calc(100% - 64px); margin: 0 auto; }
  .work-intro { width: 100%; height: auto; margin-bottom: 5rem; }
  .work-row, .work-row:nth-of-type(1), .work-row:nth-of-type(2) { display: block; height: auto; margin-top: 5rem; }
  .work-row > h3 { margin: 0 0 3rem; font-size: 3.5rem; }
  .work-viewport { width: 100%; }
  .work-card { width: 72vw; flex-basis: 72vw; }
  .work-card img { width: 100%; height: auto; }
  .numbers { padding: 6rem 0; }
  .metrics-layout { height: auto; }
  .metrics-intro, .metrics-grid { position: static; width: 100%; }
  .metrics-intro { margin-bottom: 4rem; }
  .metrics-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 17rem; }
  .team { padding: 6rem 0 8rem; }
  .team-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; }
  .team-grid article { height: auto; min-height: 35rem; }
  .team-grid .person { width: min(18rem, 100%); height: min(18rem, 100%); }
  .insights { padding: 6rem 0; }
  .insights > .container { width: calc(100% - 64px); margin: 0 auto; }
  .blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .blog-grid img { width: 100%; height: auto; }
  .contact { padding: 7rem 0; }
  .contact-inner { width: min(50rem, calc(100% - 64px)); padding: 0; transform: none; }
  .contact h2 { white-space: normal; margin-left: 0; margin-right: 0; }
  footer { height: auto; }
  .footer-grid { height: auto; grid-template-columns: 1.1fr 1fr 1fr; gap: 3rem; padding: 5rem 0; }
  .footer-logo { width: 14rem; height: auto; }
  .footer-grid > div:not(:first-child) { padding-top: 0; }
  .footer-grid > div:nth-child(2) { grid-column: span 2; }
  .legal { height: auto; min-height: 7rem; padding: 2rem 0; }
}

@media (max-width: 760px) {
  .brand-logos { margin-top: 2rem; height: 4.5rem; }
  .brand-track { gap: 3rem; }
  .brand-track img { max-height: 3.5rem !important; width: auto !important; }
  footer { height: auto; }
  .footer-grid { height: auto; display: grid; grid-template-columns: 1fr; gap: 3rem; padding: 4rem 0; text-align: center; }
  .footer-grid > div, .footer-grid > div:first-child, .footer-grid > div:nth-child(2), .footer-grid > div:not(:first-child) { grid-column: auto; padding-top: 0; }
  .footer-logo { width: 10rem; height: auto; margin: 0 auto; }
  .footer-grid h3 { margin-bottom: 1rem; }
  .footer-grid .links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 1.25rem; text-align: left; }
  .footer-grid .links a { white-space: normal; }
  .email { display: inline-block; max-width: 100%; overflow-wrap: anywhere; }
  .social { justify-content: center; margin-top: 1.25rem !important; }
  .social a { width: 2.75rem; height: 2.75rem; }
  .legal { height: auto; display: flex; flex-direction: column; align-items: center; gap: 1rem; padding: 2rem 0; text-align: center; }
  .legal > span:last-child { margin-top: 0; gap: 1.5rem; }
}

/* Project-grid fallback for the current static markup. */
.work-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3rem;
  width: 100%;
}
.work-grid img { width: 100%; height: auto; object-fit: cover; }
@media (max-width: 760px) {
  .work-grid { grid-template-columns: 1fr; gap: 1.5rem; }
}

/* All service cards start inactive, including on touch devices. */
.service-grid article:first-child {
  padding: 2.5rem;
  box-shadow: 0 0.75rem 1.5rem #0003;
}
.service-grid article:first-child .service-icon { background: #2b2b2b; }
.service-grid article:first-child h3 { margin-top: 1.5rem; }

/* Narrow tablets use the compact header and roomier single-column content. */
@media (min-width: 761px) and (max-width: 900px) {
  .header { height: 80px; }
  .nav nav { display: none; position: absolute; left: -32px; right: -32px; top: 80px; transform: none; padding: 24px 32px; background: #000; z-index: 30; gap: 18px; flex-direction: column; align-items: flex-start; }
  .nav nav.open { display: flex; }
  .nav nav a { font-size: 18px; }
  .menu { display: block; margin-left: auto; background: none; border: 0; color: #fff; font-size: 26px; }
  .actions { gap: 15px; margin-left: 20px; }
  .header .btn { display: none; }
  .two-col { display: block; }
  .about-media { width: 100%; max-width: 560px; margin: 0 auto; }
  .about-copy { max-width: 620px; margin: 0 auto; padding-top: 3rem; }
  .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-grid article { min-height: 36rem; }
  .work-grid { grid-template-columns: 1fr; max-width: 620px; margin: 0 auto; }
  .contact-inner { width: min(50rem, calc(100% - 64px)); }
}

/* Shared active state for service cards: hover on desktop, tap on touch screens. */
.service-grid article {
  position: relative;
  transition: transform .22s ease, box-shadow .22s ease;
}
.service-grid article:hover,
.service-grid article.is-active {
  transform: translateY(-.3125rem);
  box-shadow: -.75rem .5rem 0 var(--red), 0 .9375rem 1.75rem rgba(0,0,0,.2);
}
.service-grid article:hover .service-icon,
.service-grid article.is-active .service-icon {
  background: var(--red);
}

/* Corrected service-card active layer. Desktop cards activate only while hovered;
   touch devices retain one selected card after a tap. */
@media (hover: hover) and (pointer: fine) {
  .service-grid article:hover {
    transform: translateY(-.25rem);
    box-shadow: -.5rem .375rem 0 var(--red), 0 .75rem 1.5rem rgba(0,0,0,.22);
  }
  .service-grid article:hover .service-icon { background: var(--red); }
}
.service-grid article.is-active {
  transform: translateY(-.25rem);
  box-shadow: -.5rem .375rem 0 var(--red), 0 .75rem 1.5rem rgba(0,0,0,.22);
}
.service-grid article.is-active .service-icon { background: var(--red); }
@media (hover: none) {
  .service-grid article:hover:not(.is-active) {
    transform: none;
    box-shadow: 0 .75rem 1.5rem #0003;
  }
  .service-grid article:hover:not(.is-active) .service-icon { background: #2b2b2b; }
}

/* Service-card hover: the red layer is a soft depth shadow, matching Digital Strategy. */
@media (hover: hover) and (pointer: fine) {
  .service-grid article:hover {
    transform: translateY(-.25rem);
    box-shadow: 0 1rem 1.75rem rgba(207, 14, 26, .26), 0 .75rem 1.5rem rgba(0, 0, 0, .14);
  }
}
.service-grid article.is-active {
  transform: translateY(-.25rem);
  box-shadow: 0 1rem 1.75rem rgba(207, 14, 26, .26), 0 .75rem 1.5rem rgba(0, 0, 0, .14);
}

/* Turkish text wrapping requested for individual device ranges. */
.desktop-line-break { display: block; }
.mobile-line-break { display: inline; }
.desktop-tablet-break { display: inline; }
@media (max-width: 760px) {
  .desktop-line-break { display: inline; }
  .mobile-line-break { display: block; }
  .desktop-tablet-break { display: none; }
}

/* Keep the awards sentence break above the mobile range. */
.desktop-tablet-break { display: block; }
@media (max-width: 760px) { .desktop-tablet-break { display: none; } }


/* Logo carousel: consistent visual height for mixed aspect-ratio partner logos. */
.brand-track img {
  width: auto !important;
  height: 4.25rem;
  max-width: 15rem;
  max-height: 4.25rem !important;
  object-fit: contain;
}
@media (max-width: 760px) {
  .brand-track img { height: 3.25rem; max-height: 3.25rem !important; max-width: 11rem; }
}

/* Partner-logo optical sizing. Each mark occupies one consistent carousel slot. */
.brand-track img.brand-logo {
  width: 11.5rem !important;
  height: 4rem !important;
  max-width: 11.5rem !important;
  max-height: 4rem !important;
  object-fit: contain;
}
.brand-track img.brand-logo--turtle {
  width: 8.25rem !important;
  height: 3rem !important;
  max-width: 8.25rem !important;
  max-height: 3rem !important;
}
.brand-track img.brand-logo--auto-king {
  width: 8.75rem !important;
  height: 3.25rem !important;
  max-width: 8.75rem !important;
  max-height: 3.25rem !important;
}
@media (max-width: 760px) {
  .brand-track img.brand-logo { width: 8.75rem !important; height: 3.25rem !important; max-width: 8.75rem !important; max-height: 3.25rem !important; }
  .brand-track img.brand-logo--turtle { width: 6.5rem !important; height: 2.5rem !important; max-width: 6.5rem !important; max-height: 2.5rem !important; }
  .brand-track img.brand-logo--auto-king { width: 7rem !important; height: 2.75rem !important; max-width: 7rem !important; max-height: 2.75rem !important; }
}

/* Make every partner mark as legible as the BERN reference mark. */
.brand-logos img { opacity: .72; }
.brand-track img.brand-logo {
  width: 12rem !important;
  height: 4rem !important;
  max-width: 12rem !important;
  max-height: 4rem !important;
  object-fit: contain;
  object-position: center;
}
.brand-track img.brand-logo--turtle { width: 8.75rem !important; height: 3.1rem !important; max-width: 8.75rem !important; max-height: 3.1rem !important; }
.brand-track img.brand-logo--auto-king { width: 9rem !important; height: 3.35rem !important; max-width: 9rem !important; max-height: 3.35rem !important; }
@media (max-width: 760px) {
  .brand-track img.brand-logo { width: 9rem !important; height: 3.25rem !important; max-width: 9rem !important; max-height: 3.25rem !important; }
}

/* Contact form security */
.form-honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.turnstile-wrap { margin:22px 0 18px; min-height:65px; }
.form-message.is-error { color:#b91c1c; }
.form-message.is-success { color:#176b38; }

/* Contact form refinements */
.contact .fields input,
.contact .fields textarea { font-size:1.25rem; }
.contact label { font-size:.875rem; }
.turnstile-wrap { display:flex; justify-content:flex-start; margin:14px 0 18px; }
@media (max-width:760px) {
  .contact .fields input,
  .contact .fields textarea { font-size:15px; }
  .contact label { font-size:10px; }
  .turnstile-wrap { margin:12px 0 18px; }
}

/* Policy pages */
.policy-page { background:#f7f7f7; color:#292929; min-height:100vh; }
.policy-header { background:#000; color:#fff; }
.policy-header .container { min-height:92px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.policy-logo { width:120px; }
.policy-home, .policy-language { color:#fff; text-decoration:none; background:transparent; border:0; font:500 15px Poppins,Arial,sans-serif; }
.policy-language { padding:8px 12px; border:1px solid #777; border-radius:999px; }
.policy-actions { display:flex; align-items:center; gap:22px; }
.policy-content { max-width:980px; margin:0 auto; padding:90px 20px; }
.policy-content h1 { font-size:44px; line-height:1.2; margin:0 0 12px; }
.policy-content .updated { color:#777; font-size:15px; margin-bottom:48px; }
.policy-content h2 { font-size:25px; line-height:1.35; letter-spacing:0; margin:35px 0 12px; }
.policy-content p, .policy-content li { font-size:17px; line-height:1.75; }
.policy-content ul { padding-left:24px; }
.policy-content a { color:#b20d19; }
.policy-footer { padding:26px 20px; border-top:1px solid #ddd; color:#667085; font-size:14px; text-align:center; }
@media (max-width:760px) { .policy-header .container { min-height:76px; } .policy-logo { width:95px; } .policy-content { padding:55px 20px; } .policy-content h1 { font-size:32px; } .policy-content h2 { font-size:22px; } .policy-content p, .policy-content li { font-size:15px; } .policy-home { display:none; } }


/* v22: SEO, mobile usability and policy navigation */
.brand-logos { touch-action: pan-x; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.about-media span { padding-left:0; font-size:0; }
.about-media span::after { content:''; display:block; margin-left:5%; width:0; height:0; border-top:.95rem solid transparent; border-bottom:.95rem solid transparent; border-left:1.35rem solid #fff; }
.contact form > label:first-of-type { margin-top:10px; }
.contact label { font-size:.95rem; }
.contact label input { width:1.5rem; height:1.875rem; }
.policy-site-header { position:relative; }
.policy-site-header .nav nav { z-index:50; }
.policy-page .policy-content { background:#f7f7f7; }
@media (max-width:760px) {
  .brand-logos { touch-action: pan-x; cursor:grab; }
  .about-media span { width:56px; height:56px; }
  .about-media span::after { border-top:9px solid transparent; border-bottom:9px solid transparent; border-left:14px solid #fff; }
  .award-grid figure:nth-child(5) { grid-column:1 / -1; width:calc((100% - 22px) / 2); justify-self:center; }
  .desktop-contact-break { display:none; }
  .contact label { font-size:12px; line-height:18px; }
  .contact label input { width:20px; height:22px; }
  .policy-page .header .btn { display:none; }
}


/* v23: requested visual corrections */
.hero-line-break { display:block !important; }
.about-media span { top:50% !important; left:50% !important; right:auto !important; bottom:auto !important; transform:translate(-50%, -50%) !important; }
.about-media span::after { margin-left:0; transform:translateX(8%); }
@media (min-width:761px) {
  .policy-page .policy-site-header,
  .policy-page .policy-site-header .nav { background:#000 !important; color:#fff; }
  .policy-page .policy-site-header nav a,
  .policy-page .policy-site-header .language { color:#fff !important; }
  .policy-page .policy-content { padding-bottom:40px; }
  .policy-page .policy-footer { padding:14px 20px; }
}
@media (max-width:760px) { .hero-line-break { display:block !important; } }

/* v26: optically centre the play triangle without changing the button size */
.about-media span::after {
  position:absolute;
  left:50%;
  top:50%;
  margin:0;
  transform:translate(-33.333%, -50%);
}
