/* Mobile-first enhancements */

html {
  overflow-x: hidden;
}

body {
  overflow-x: hidden;
}

body.nav-open {
  overflow: hidden;
  touch-action: none;
}

/* Drawer must sit ABOVE fixed navbar shell */
body.nav-open .site-navbar-shell {
  transform: none !important;
  z-index: 150 !important;
  pointer-events: none;
}

body.nav-open .mobile-menu-btn,
body.nav-open .site-search-btn {
  pointer-events: auto;
}

body.nav-open .site-header .header-inner {
  pointer-events: none;
}

body.nav-open .wa-chat-widget,
body.nav-open .scroll-top-btn,
body.nav-open .cookie-consent {
  visibility: hidden;
  pointer-events: none;
}

@media (max-width: 768px) {
  body.nav-open {
    overflow: hidden;
    touch-action: none;
  }

  /* Hide topbar on mobile — contact/lang live in drawer footer.
     !important beats animations.css display:grid rules. */
  #site-topbar,
  .site-navbar-shell #site-topbar,
  .site-navbar-shell.topbar-collapsed #site-topbar,
  .site-navbar-shell.is-glass #site-topbar {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }

  .container {
    width: min(1200px, calc(100% - 32px));
  }

  /* Kampanya şeridi — mobilde sadeleştir */
  .campaign-banner {
    padding: 6px 0;
    font-size: 0.72rem;
  }

  .campaign-banner-inner {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0;
    min-height: 34px;
  }

  .campaign-countdown {
    display: none !important;
  }

  .campaign-banner.has-countdown .campaign-marquee {
    display: block;
    width: 100%;
  }

  .campaign-marquee-item {
    font-size: 0.72rem;
  }

  /* Header — masaüstü CTA'ları gizle */
  .site-header .btn-header-test,
  .site-header .btn-header-blog,
  .header-inner > .btn-header-test,
  .header-inner > .btn-header-blog {
    display: none !important;
  }

  .site-header {
    position: relative;
    z-index: 1;
  }

  .header-inner {
    display: flex;
    position: relative;
    padding: 8px 0;
    gap: 10px;
    flex-wrap: nowrap;
    align-items: center;
  }

  .logo {
    flex: 1 1 auto;
    min-width: 0;
    margin-left: -8px;
  }

  .logo img,
  .logo .header-logo {
    max-height: 44px;
    max-width: min(140px, 40vw);
  }

  .site-header.scrolled .logo img,
  .site-header.scrolled .logo .header-logo {
    max-height: 40px;
    max-width: min(124px, 36vw);
  }

  .header-actions {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 6px;
  }

  .header-cta-group {
    display: none !important;
  }

  .header-actions .site-search-btn {
    width: 40px;
    height: 40px;
  }

  .mobile-menu-btn {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 10px;
    margin: 0;
    border-radius: 10px;
    background: var(--gray-100, #f3f4f6);
  }

  .mobile-menu-btn span {
    margin: 2px 0;
  }

  .nav-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(10, 12, 18, 0.55);
    z-index: 300;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
  }

  .nav-backdrop.visible {
    opacity: 1;
    visibility: visible;
  }

  .main-nav {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: auto;
    width: min(340px, 88vw);
    max-width: 88vw;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    padding: 0;
    background: var(--white);
    box-shadow: -12px 0 40px rgba(0, 0, 0, 0.28);
    overflow: hidden;
    z-index: 310;
    transform: translateX(105%);
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    border-top: none;
    box-sizing: border-box;
    gap: 0;
    justify-content: flex-start;
    flex-wrap: nowrap;
  }

  .main-nav.open {
    transform: translateX(0);
  }

  .mobile-nav-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
    padding: 14px 16px;
    padding-top: max(14px, env(safe-area-inset-top));
    padding-right: max(16px, env(safe-area-inset-right));
    border-bottom: 1px solid var(--gray-200);
    background: var(--white);
  }

  .mobile-nav-title {
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--black);
  }

  .mobile-nav-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 4px 16px 10px;
    padding-right: max(16px, env(safe-area-inset-right));
  }

  .mobile-nav-body > .nav-dropdown,
  .mobile-nav-body > a {
    flex-shrink: 0;
  }

  .mobile-nav-body > .nav-dropdown {
    display: block;
    align-self: stretch;
    width: 100%;
    min-width: 0;
    min-height: 0;
  }

  .mobile-nav-close {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: none;
    background: var(--gray-100);
    border-radius: 50%;
    color: var(--black);
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
  }

  .mobile-nav-close svg {
    width: 22px;
    height: 22px;
    display: block;
  }

  .mobile-nav-close:hover,
  .mobile-nav-close:focus-visible {
    background: var(--red);
    color: var(--white);
  }

  .mobile-nav-body .nav-dropdown-menu {
    position: static;
    inset: auto;
    left: auto;
    top: auto;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0 0 8px;
    transform: none;
    box-shadow: none;
    border: none;
    box-sizing: border-box;
    padding: 0 0 0 12px;
    display: none;
  }

  .mobile-nav-body .nav-dropdown.open > .nav-dropdown-menu {
    display: block;
  }

  .mobile-nav-body .nav-dropdown {
    border-bottom: 1px solid var(--gray-100);
  }

  .mobile-nav-body .nav-dropdown-toggle {
    display: flex;
    width: 100%;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    padding: 11px 0;
    text-align: left;
    font-size: 0.86rem;
    font-weight: 700;
    text-transform: uppercase;
    white-space: normal;
    color: var(--black);
  }

  .nav-dropdown-toggle--mega {
    justify-content: space-between;
    gap: 8px;
  }

  .mobile-nav-body .nav-mega-menu--courses,
  .mobile-nav-body .nav-mega-courses-grid,
  .mobile-nav-body .nav-mega-courses-card {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }

  .mobile-nav-body .nav-mega-courses-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .mobile-nav-body .nav-dropdown-menu.nav-mega-menu--courses {
    padding: 0;
  }

  .mobile-nav-body .nav-mega-courses-card {
    border-radius: 14px;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
  }

  .mobile-nav-body .nav-mega-courses-title {
    padding: 14px 16px;
    font-size: 0.8rem;
    line-height: 1.35;
    letter-spacing: 0.05em;
  }

  .mobile-nav-body .nav-mega-courses-item,
  .mobile-nav-body .nav-dropdown-menu a.nav-mega-courses-item {
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    min-height: 48px;
    font-size: 0.92rem;
    line-height: 1.45;
    font-weight: 600;
  }

  .mobile-nav-body .nav-mega-courses-item-icon {
    width: 22px;
    height: 22px;
    margin-top: 0.12em;
    flex-shrink: 0;
  }

  .mobile-nav-body .nav-mega-courses-item-icon svg {
    width: 20px;
    height: 20px;
  }

  .mobile-nav-body .nav-mega-courses-item:not(:last-child)::after,
  .mobile-nav-body .nav-dropdown-menu a.nav-mega-courses-item:not(:last-child)::after {
    left: 16px;
    right: 16px;
  }

  .mobile-nav-body .nav-mega-courses-all,
  .mobile-nav-body .nav-dropdown-menu a.nav-mega-courses-all {
    margin: 12px 14px 14px;
    min-height: 48px;
    font-size: 0.92rem;
  }

  .nav-mega-main-link {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0;
    color: var(--black);
    text-decoration: none;
  }

  .nav-dropdown-caret-btn {
    flex-shrink: 0;
    padding: 4px 6px;
    color: var(--black);
  }

  .nav-dropdown-toggle.active::after {
    display: none;
  }

  .nav-dropdown-menu a {
    padding: 10px 0 10px 12px;
    border-bottom: none;
    font-size: 0.9rem;
    text-transform: none;
  }

  .mobile-nav-extras {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: auto;
    padding-top: 12px;
    padding-bottom: 2px;
    border-top: 1px solid var(--gray-200);
    width: 100%;
    flex-shrink: 0;
  }

  .mobile-nav-bar {
    display: grid;
    grid-template-columns: 1fr auto auto;
    grid-template-areas:
      "phone phone phone"
      "util util util"
      "social social social";
    align-items: center;
    justify-content: stretch;
    gap: 10px;
    flex: 0 0 auto;
    min-height: 0;
    margin: 0;
    padding: 12px 14px max(12px, env(safe-area-inset-bottom));
    padding-right: max(14px, env(safe-area-inset-right));
    width: 100%;
    background: #0a0a0a;
    border-top: 1px solid rgba(212, 175, 55, 0.22);
    box-sizing: border-box;
  }

  .mobile-nav-phone {
    grid-area: phone;
  }

  .mobile-nav-bar:not(:has(.mobile-nav-bar-util)) {
    grid-template-areas:
      "phone phone phone"
      ". search lang"
      "social social social";
  }

  .mobile-nav-bar-tools {
    display: contents;
  }

  .mobile-nav-bar:not(:has(.mobile-nav-bar-util)) > .mobile-nav-bar-lang {
    grid-area: lang;
    justify-self: end;
    padding-right: 40px;
  }

  .mobile-nav-bar-tools > .site-search-btn--drawer {
    grid-area: search;
    justify-self: end;
    margin-right: 8px;
  }

  .mobile-nav-phone {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin: 0;
    padding: 10px 14px;
    border-radius: 12px;
    background: rgba(212, 175, 55, 0.12);
    border: 1px solid rgba(212, 175, 55, 0.45);
    color: #f0d78c;
    font-size: 0.95rem;
    font-weight: 700;
    text-decoration: none;
    letter-spacing: 0.03em;
    box-sizing: border-box;
  }

  .main-nav .mobile-nav-bar a.mobile-nav-phone {
    padding: 10px 14px;
    border-bottom: none;
    color: #f0d78c;
    text-align: center;
  }

  .main-nav .mobile-nav-bar a.mobile-nav-phone span {
    color: inherit;
  }

  .mobile-nav-phone svg {
    width: 16px;
    height: 16px;
    fill: var(--gold);
    flex-shrink: 0;
  }

  .mobile-nav-bar-util {
    grid-area: util;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    width: 100%;
    padding-right: 52px;
    box-sizing: border-box;
  }

  .mobile-nav-bar-search {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    order: 1;
  }

  .mobile-nav-bar-lang {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-width: 0;
    width: auto;
    margin: 0;
    padding: 0;
    order: 2;
  }

  .mobile-nav-bar-lang .top-bar-lang-box {
    margin: 0;
    padding: 6px 12px;
    gap: 8px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(212, 175, 55, 0.28);
    border-radius: 999px;
  }

  .mobile-nav-bar-lang .top-bar-lang-label {
    display: none;
  }

  .mobile-nav-bar-lang .top-bar-lang {
    gap: 8px;
  }

  .mobile-nav-bar-lang .lang-flag-btn {
    width: 42px;
    height: 42px;
  }

  .mobile-nav-bar-lang .lang-flag-img {
    width: 27px;
    height: 18px;
  }

  .mobile-nav-bar-util .site-search-btn--drawer,
  .mobile-nav-bar-search .site-search-btn--drawer,
  .mobile-nav-bar-tools > .site-search-btn--drawer {
    width: 42px;
    height: 42px;
    min-width: 42px;
    min-height: 42px;
    flex-shrink: 0;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 50%;
    color: rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
    transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  }

  .mobile-nav-bar-util .site-search-btn--drawer svg,
  .mobile-nav-bar-search .site-search-btn--drawer svg,
  .mobile-nav-bar-tools > .site-search-btn--drawer svg {
    width: 20px;
    height: 20px;
  }

  .mobile-nav-bar-util .site-search-btn--drawer:hover,
  .mobile-nav-bar-util .site-search-btn--drawer:focus-visible,
  .mobile-nav-bar-search .site-search-btn--drawer:hover,
  .mobile-nav-bar-search .site-search-btn--drawer:focus-visible,
  .mobile-nav-bar-tools > .site-search-btn--drawer:hover,
  .mobile-nav-bar-tools > .site-search-btn--drawer:focus-visible {
    background: rgba(212, 175, 55, 0.18);
    border-color: rgba(212, 175, 55, 0.42);
    color: var(--gold);
    transform: translateY(-1px);
  }

  .mobile-nav-bar-social,
  .mobile-nav-bar-social.mobile-nav-social,
  .mobile-nav-bar-tools > .mobile-nav-social {
    grid-area: social;
    display: block;
    width: 100%;
    margin: 0;
    padding: 12px 8px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    box-sizing: border-box;
  }

  .mobile-nav-bar-tools > .mobile-nav-social {
    width: 100%;
    margin-left: 0;
    flex-shrink: initial;
  }

  .mobile-nav-bar-social .contact-buttons,
  .mobile-nav-social .contact-buttons {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-wrap: nowrap;
    gap: 0;
    width: 100%;
    margin: 0;
    padding: 0 2px;
    min-width: 0;
    overflow: visible;
  }

  .mobile-nav-bar-social .contact-buttons::-webkit-scrollbar,
  .mobile-nav-social .contact-buttons::-webkit-scrollbar {
    display: none;
  }

  .mobile-nav-bar-social::before,
  .mobile-nav-social::before {
    display: none;
  }

  .mobile-nav-bar .contact-icon-btn {
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    min-width: 42px;
    min-height: 42px;
    max-width: 42px;
    max-height: 42px;
    aspect-ratio: 1;
    padding: 0;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: transparent;
    color: rgba(255, 255, 255, 0.88);
    box-shadow: none;
    transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  }

  .mobile-nav-bar .contact-icon-btn svg {
    width: 21px;
    height: 21px;
  }

  .mobile-nav-bar .contact-icon-btn:hover {
    transform: translateY(-1px);
    color: #fff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.28);
  }

  .mobile-nav-bar .contact-icon-btn:active {
    transform: scale(0.94);
  }

  .mobile-nav-bar .contact-icon-btn--instagram:hover {
    background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
    box-shadow: 0 4px 14px rgba(225, 48, 108, 0.35);
    color: #fff;
  }

  .mobile-nav-bar .contact-icon-btn--facebook:hover {
    background: #1877f2;
    box-shadow: 0 4px 14px rgba(24, 119, 242, 0.35);
    color: #fff;
  }

  .mobile-nav-bar .contact-icon-btn--tiktok:hover {
    background: #010101;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45);
    color: #25f4ee;
  }

  .mobile-nav-bar .contact-icon-btn--youtube:hover {
    background: #ff0000;
    box-shadow: 0 4px 14px rgba(255, 0, 0, 0.35);
    color: #fff;
  }

  .mobile-nav-bar .contact-icon-btn--linkedin:hover {
    background: #0a66c2;
    box-shadow: 0 4px 14px rgba(10, 102, 194, 0.35);
    color: #fff;
  }

  .mobile-nav-bar .top-bar-lang-box {
    flex-shrink: 0;
  }

  .mobile-nav-extras .mobile-nav-btn,
  .mobile-nav-extras .mobile-nav-lang {
    width: 100%;
    justify-content: center;
    text-align: center;
    white-space: normal;
    padding: 10px 14px;
    min-height: 42px;
    font-size: 0.8rem;
  }

  .main-nav .mobile-nav-extras a.btn-header-test,
  .main-nav a.btn-header-test {
    color: #fff !important;
    border-bottom: none;
    background: linear-gradient(135deg, var(--red), var(--red-dark));
  }

  .main-nav .mobile-nav-extras a.btn-header-blog,
  .main-nav a.btn-header-blog {
    color: var(--black) !important;
    border-bottom: none;
    background: var(--gold);
  }

  .main-nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid var(--gray-100);
    text-align: left;
    color: var(--black);
    font-size: 0.86rem;
    font-weight: 700;
  }

  .main-nav .mobile-nav-bar a.contact-icon-btn,
  .main-nav .mobile-nav-bar a.contact-icon-btn--sm {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    min-width: 34px;
    min-height: 34px;
    max-width: 34px;
    max-height: 34px;
    padding: 0 !important;
    gap: 0;
    margin: 0;
    border-bottom: none !important;
    text-align: center;
    line-height: 0;
    flex-shrink: 0;
  }

  .main-nav .mobile-nav-bar a.contact-icon-btn svg {
    display: block;
    width: 17px;
    height: 17px;
  }

  .main-nav a.active::after {
    display: none;
  }

  .main-nav a.active {
    color: var(--red);
    font-weight: 700;
  }

  .hero-content h1 {
    font-size: var(--banner-title-size-mobile);
  }

  .hero-badge {
    font-size: var(--banner-kicker-size-mobile);
    padding: 7px 12px;
    margin-bottom: 14px;
  }

  .hero-content p {
    font-size: var(--banner-lead-size-mobile);
  }

  #hero-prev {
    left: 12px;
  }

  #hero-next {
    right: 12px;
  }

  .hero-arrows {
    display: none;
  }

  .hero {
    touch-action: pan-y;
  }

  .hero-arrow {
    width: 42px;
    height: 42px;
    font-size: 1.2rem;
  }

  .hero-dots {
    gap: 10px;
  }

  .hero-dots-bar {
    height: 48px;
    background: transparent;
  }

  .courses-tab {
    flex: 1 1 auto;
    min-width: 0;
    padding: 10px 16px;
    font-size: 0.85rem;
  }

  .features-grid,
  .page-links-grid,
  .blog-grid,
  .instructors-grid,
  .testimonials-grid,
  .pricing-grid,
  .stories-grid,
  .regions-inner,
  .consultancy-grid,
  .courses-grid,
  .process-steps,
  .about-stats-grid,
  .about-values-grid,
  .about-mvv-grid,
  .lead-grid,
  .about-layout,
  .about-grid,
  .home-proof-stats,
  .home-proof-stories--wide,
  .home-proof-grid,
  .video-grid,
  .contact-grid {
    grid-template-columns: 1fr !important;
  }

  .pricing-card-popular {
    transform: none;
  }

  .footer-grid {
    grid-template-columns: 1fr !important;
    gap: 24px;
  }

  /* styles.css @992px places contact in column 2; that creates an implicit
     second track on phones and clips the footer. Reset all placements. */
  .footer-brand,
  .footer-col,
  .footer-links,
  .footer-popular,
  .footer-contact,
  .footer-contact--end {
    grid-column: 1 / -1 !important;
    grid-row: auto !important;
    justify-self: stretch !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .footer-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 22px 18px 18px;
  }

  .footer-brand::after {
    display: none;
  }

  .footer-text {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }

  .footer-logo-shell {
    display: none;
  }

  .footer-brand .footer-logo {
    margin-left: auto;
    margin-right: auto;
    object-position: center;
  }

  .footer-brand .contact-buttons {
    justify-content: center;
  }

  .footer-col {
    text-align: center;
  }

  .footer-col ul {
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .footer-col ul a {
    display: inline-block;
  }

  .footer-contact-list {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .footer-contact-list a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: normal;
    overflow-wrap: anywhere;
    max-width: 100%;
  }

  .footer-contact-icon {
    display: inline-flex;
    margin: 0;
  }

  .footer-bottom {
    flex-direction: column;
    gap: 12px;
    text-align: center;
  }

  .footer-legal {
    flex-wrap: wrap;
    justify-content: center;
  }

  .home-proof-story {
    grid-template-columns: 1fr;
  }

  .home-proof-story-body {
    padding: 0 14px 14px;
  }

  .home-proof-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .home-proof-actions .btn {
    width: 100%;
    justify-content: center;
  }

  .consultancy-guide-links {
    justify-content: center;
  }

  .placement-result-actions {
    flex-direction: column;
  }

  .placement-result-actions .btn {
    width: 100%;
  }

  .contact-whatsapp-box {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }

  .btn-whatsapp-contact {
    justify-content: center;
  }

  .site-search-overlay {
    padding: 8vh 12px 20px;
    align-items: flex-start;
  }

  .site-search-dialog {
    border-radius: 14px;
  }

  .footer-cta {
    flex-direction: column;
    padding: 28px 24px;
    text-align: center;
  }

  .footer-cta-content {
    min-width: 0;
  }

  .footer-cta-content p {
    margin: 0 auto;
  }

  .footer-cta-actions {
    width: 100%;
    flex-direction: column;
  }

  .footer-cta-btn {
    width: 100%;
    justify-content: center;
  }

  .footer-cta-btn span {
    align-items: center;
    text-align: center;
  }

  .scroll-top-btn {
    bottom: 20px;
    left: 16px;
    right: auto;
    width: 44px;
    height: 44px;
  }

  .wa-chat-widget {
    bottom: 76px;
    right: 16px;
    max-width: calc(100vw - 24px);
  }

  .wa-chat-panel {
    width: min(300px, calc(100vw - 24px));
  }

  .wa-chat-toggle {
    width: 54px;
    height: 54px;
  }

  .wa-chat-teaser {
    max-width: min(210px, calc(100vw - 88px));
    padding: 9px 12px;
  }

  .wa-chat-teaser-text {
    font-size: 0.78rem;
  }

  .placement-features {
    grid-template-columns: 1fr;
  }

  .placement-register-actions {
    flex-direction: column;
  }

  .placement-register-actions .btn {
    width: 100%;
  }

  .placement-card h2 {
    font-size: 1.1rem;
  }

  .placement-opt {
    font-size: 0.9rem;
    padding: 14px;
  }

  .placement-nav {
    flex-direction: column-reverse;
  }

  .placement-nav-btn {
    width: 100%;
    min-width: 0;
  }

  .campaign-marquee-track {
    animation-duration: 32s;
  }

  .campaign-inner {
    flex-direction: column;
    text-align: center;
    gap: 8px;
    font-size: 0.85rem;
  }

  .placement-exam-grid {
    grid-template-columns: 1fr;
  }

  .placement-exam-grid-full {
    grid-template-columns: 1fr;
    max-width: 560px;
    padding: 0 16px;
  }

  .placement-exam-tile:hover,
  .placement-exam-tile:focus-visible {
    transform: none;
    box-shadow: 0 14px 36px rgba(26, 26, 26, 0.08);
  }

  .placement-exam-tile-details {
    max-height: none;
    opacity: 1;
    margin-top: 10px;
  }

  .placement-exam-tile-lead {
    display: block;
  }

  .placement-exam-card {
    text-align: left;
  }

  .testimonial-row,
  .home-extras-grid {
    grid-template-columns: 1fr !important;
  }

  .page-hero h1 {
    font-size: 1.75rem;
  }

  .blog-detail h1 {
    font-size: 1.65rem;
  }

  .btn {
    min-height: 44px;
    padding: 12px 20px;
  }

  .contact-details a {
    color: var(--red);
    font-weight: 600;
    text-decoration: none;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .contact-details a:hover {
    text-decoration: underline;
  }

  .exam-guide-layout .container,
  .exam-guide-shell,
  .exam-guide-nav-aside,
  .exam-guide-panel {
    min-width: 0;
    max-width: 100%;
  }

  .exam-detail-card {
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
    padding: 18px 16px 32px;
    overflow-x: hidden;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .exam-detail-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .exam-detail-header > div {
    min-width: 0;
    width: 100%;
  }

  .exam-detail-header h3 {
    font-size: 1.25rem;
    line-height: 1.3;
    hyphens: none;
    overflow-wrap: break-word;
  }

  .exam-logo-card {
    min-height: 88px;
    padding: 12px 8px;
  }

  .exam-guide-logos .exam-logo-card,
  .exam-guide-logos button.exam-logo-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 6px;
  }

  .exam-guide-logos .exam-logo-card-visual {
    flex: 0 0 var(--exam-logo-h, 40px);
    width: var(--exam-logo-w, 112px);
    height: var(--exam-logo-h, 40px);
    min-height: var(--exam-logo-h, 40px);
    max-height: var(--exam-logo-h, 40px);
    padding: 0;
  }

  .exam-logo-card img:not(.exam-logo-image) {
    width: var(--exam-logo-w, 96px);
    max-height: var(--exam-logo-h, 34px);
    height: var(--exam-logo-h, 34px);
  }

  .exam-guide-logos,
  .exam-guide-body > .exam-guide-layout {
    --exam-logo-w: 112px;
    --exam-logo-h: 40px;
  }

  .exam-guide-logos .exam-logo-card,
  .exam-guide-logos button.exam-logo-card {
    height: 112px;
    min-height: 112px;
    max-height: 112px;
    padding: 8px 6px;
    gap: 8px;
  }

  .exam-guide-logos .exam-logo-badge {
    height: 32px;
    min-height: 32px;
    max-height: 32px;
    font-size: 0.56rem;
  }

  /* 5+5 iki satır yerine tek 2 sütun — tek kalan logonun yanında boşluk kalmaz */
  .exam-guide-logos .exams-logo-rows--puzzle {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    max-width: none;
    align-items: stretch;
  }

  .exam-guide-logos .exams-logo-rows--puzzle .exams-logo-row {
    display: contents;
  }

  .exam-guide-tab[data-filter="osd"] .exam-guide-tab-logo {
    --exam-nav-logo-visual: var(--exam-nav-logo-visual-osd);
  }
  .exam-guide-logos .exam-logo-card-visual img,
  .exam-guide-logos button.exam-logo-card img.exam-logo-image,
  .exam-guide-logos .exam-logo-card[data-filter] img.exam-logo-image {
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: 100% !important;
    --exam-logo-scale: 1 !important;
    transform: none !important;
    object-fit: contain;
    object-position: center center;
  }

  .exam-detail-logo-wrap {
    width: 120px;
    height: 42px;
    flex: 0 0 120px;
  }

  .exam-detail-logo {
    width: 120px !important;
    height: 42px !important;
    min-width: 120px;
    min-height: 42px;
    max-width: 120px;
    max-height: 42px;
  }

  .exam-guide-nav-aside {
    width: 100%;
  }

  .exam-guide-nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    position: static;
    top: auto;
    overflow: visible;
    overscroll-behavior: auto;
    scroll-snap-type: none;
    padding: 10px;
    margin: 0 0 16px;
    box-shadow: none;
    border: 1px solid var(--gray-200);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.96);
    --exam-nav-logo-slot-w: 52px;
    --exam-nav-logo-slot-h: 30px;
    --exam-nav-logo-h: 20px;
    --exam-nav-logo-max-w: 48px;
  }

  .exam-guide-nav::-webkit-scrollbar {
    display: none;
  }

  .exam-guide-tab {
    flex: unset;
    width: 100%;
    min-width: 0;
    max-width: none;
    padding: 8px 10px;
    font-size: 0.72rem;
    gap: 6px;
    scroll-snap-align: unset;
  }

  .exam-guide-tab-label {
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: none;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .exam-guide-nav .exam-guide-tab {
    display: grid;
    grid-template-columns: var(--exam-nav-logo-slot-w) minmax(0, 1fr);
    align-items: center;
    gap: 6px;
  }

  .exam-guide-nav .exam-guide-tab[data-filter="all"] {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    padding: 10px 12px;
    font-size: 0.82rem;
  }

  .exam-guide-nav .exam-guide-tab-logo-slot,
  .exam-guide-nav .exam-guide-tab[data-filter] .exam-guide-tab-logo-slot {
    flex: none;
    width: var(--exam-nav-logo-slot-w) !important;
    min-width: var(--exam-nav-logo-slot-w) !important;
    max-width: var(--exam-nav-logo-slot-w) !important;
    height: var(--exam-nav-logo-slot-h);
    justify-content: center;
    overflow: hidden;
  }

  .exam-guide-nav .exam-guide-tab-logo,
  .exam-guide-nav .exam-guide-tab[data-filter] .exam-guide-tab-logo {
    width: auto !important;
    height: var(--exam-nav-logo-h) !important;
    min-width: 0 !important;
    max-width: var(--exam-nav-logo-max-w, 58px) !important;
    min-height: 0 !important;
    max-height: var(--exam-nav-logo-h) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: center center !important;
    transform: scale(var(--exam-nav-logo-scale, 1)) !important;
    transform-origin: center center !important;
  }

  .exam-guide-nav .exam-guide-tab[data-filter="goethe"] .exam-guide-tab-logo { --exam-nav-logo-max-w: 52px; }
  .exam-guide-nav .exam-guide-tab[data-filter="telc"] .exam-guide-tab-logo { --exam-nav-logo-max-w: 54px; }
  .exam-guide-nav .exam-guide-tab[data-filter="testdaf"] .exam-guide-tab-logo { --exam-nav-logo-max-w: 56px; }
  .exam-guide-nav .exam-guide-tab[data-filter="osd"] .exam-guide-tab-logo { --exam-nav-logo-max-w: 55px; }
  .exam-guide-nav .exam-guide-tab[data-filter="dsh"] .exam-guide-tab-logo { --exam-nav-logo-max-w: 56px; }
  .exam-guide-nav .exam-guide-tab[data-filter="ielts"] .exam-guide-tab-logo { --exam-nav-logo-max-w: 54px; }
  .exam-guide-nav .exam-guide-tab[data-filter="toefl"] .exam-guide-tab-logo {
    --exam-nav-logo-max-w: 54px;
    --exam-nav-logo-h: 20px;
    max-height: 20px !important;
  }
  .exam-guide-nav .exam-guide-tab[data-filter="pte"] .exam-guide-tab-logo { --exam-nav-logo-max-w: 52px; }
  .exam-guide-nav .exam-guide-tab[data-filter="yds"] .exam-guide-tab-logo { --exam-nav-logo-max-w: 44px; }
  .exam-guide-nav .exam-guide-tab[data-filter="yokdil"] .exam-guide-tab-logo { --exam-nav-logo-max-w: 50px; }

  .exam-guide-nav-divider {
    display: none;
  }

  .exam-facts-table {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin-bottom: 20px;
    font-size: 0.88rem;
  }

  .exam-facts-table tbody,
  .exam-facts-table tr,
  .exam-facts-table th,
  .exam-facts-table td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }

  .exam-facts-table tr {
    margin-bottom: 10px;
    border: 1px solid var(--gray-200);
    border-radius: 8px;
    overflow: hidden;
    background: var(--white);
  }

  .exam-facts-table tr:last-child {
    margin-bottom: 0;
  }

  .exam-facts-table th {
    width: auto;
    padding: 10px 12px 4px;
    border-bottom: none;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: var(--gray-600);
    background: var(--gray-50);
  }

  .exam-facts-table td {
    padding: 4px 12px 10px;
    border-bottom: none;
    line-height: 1.55;
  }

  .exam-detail-overview,
  .exam-detail-block p {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .exam-guide-actions {
    flex-direction: column;
  }

  .exam-guide-actions .btn {
    width: 100%;
  }

  .content-block-inner .btn {
    width: 100%;
  }

  .section-footer .btn {
    width: 100%;
    max-width: 320px;
  }

  .page-link-card {
    padding: 24px 20px;
  }

  .feature-card {
    padding: 28px 20px;
  }
}

@media (max-width: 768px) and (max-height: 700px) {
  .mobile-nav-head {
    padding: 10px 16px;
    padding-top: max(10px, env(safe-area-inset-top));
  }

  .main-nav a,
  .nav-dropdown-toggle {
    padding: 8px 0;
    font-size: 0.8rem;
  }

  .mobile-nav-extras {
    gap: 6px;
    margin-top: auto;
    padding-top: 8px;
  }

  .mobile-nav-extras .mobile-nav-btn,
  .mobile-nav-extras .mobile-nav-lang {
    min-height: 38px;
    padding: 8px 12px;
    font-size: 0.75rem;
  }

  .mobile-nav-bar {
    gap: 8px;
    padding: 10px 12px max(10px, env(safe-area-inset-bottom));
  }

  .mobile-nav-phone {
    padding: 9px 12px;
    font-size: 0.9rem;
  }

  .mobile-nav-bar-tools {
    gap: 8px;
    padding: 8px 10px;
  }

  .mobile-nav-bar-util {
    gap: 10px;
    padding-right: 34px;
  }

  .mobile-nav-bar-util .site-search-btn--drawer,
  .mobile-nav-bar-search .site-search-btn--drawer,
  .mobile-nav-bar-tools > .site-search-btn--drawer {
    width: 36px;
    height: 36px;
    min-width: 36px;
    min-height: 36px;
  }

  .mobile-nav-bar-lang .lang-flag-btn {
    width: 36px;
    height: 36px;
  }

  .mobile-nav-bar .contact-icon-btn {
    width: 36px;
    height: 36px;
    min-width: 36px;
    min-height: 36px;
    max-width: 36px;
    max-height: 36px;
  }

  .mobile-nav-bar .contact-icon-btn svg {
    width: 18px;
    height: 18px;
  }
}

@media (max-width: 480px) {
  .main-nav {
    width: min(310px, 90vw);
    max-width: 90vw;
  }

  .mobile-nav-bar-util {
    gap: 10px;
    padding-right: 32px;
  }

  .mobile-nav-bar-util .site-search-btn--drawer,
  .mobile-nav-bar-search .site-search-btn--drawer,
  .mobile-nav-bar-tools > .site-search-btn--drawer {
    width: 34px;
    height: 34px;
    min-width: 34px;
    min-height: 34px;
  }

  .mobile-nav-bar-util .site-search-btn--drawer svg,
  .mobile-nav-bar-search .site-search-btn--drawer svg,
  .mobile-nav-bar-tools > .site-search-btn--drawer svg {
    width: 17px;
    height: 17px;
  }

  .mobile-nav-bar-social {
    padding: 8px 6px;
  }

  .mobile-nav-bar-lang .lang-flag-btn {
    width: 34px;
    height: 34px;
  }

  .mobile-nav-bar-lang .lang-flag-img {
    width: 23px;
    height: 16px;
  }

  .mobile-nav-bar .contact-icon-btn {
    width: 34px;
    height: 34px;
    min-width: 34px;
    min-height: 34px;
    max-width: 34px;
    max-height: 34px;
  }

  .main-nav .mobile-nav-bar a.contact-icon-btn,
  .main-nav .mobile-nav-bar a.contact-icon-btn--sm {
    width: 34px;
    height: 34px;
    min-width: 34px;
    min-height: 34px;
    max-width: 34px;
    max-height: 34px;
  }

  .mobile-nav-bar .contact-icon-btn svg,
  .main-nav .mobile-nav-bar a.contact-icon-btn svg {
    width: 17px;
    height: 17px;
  }

  .mobile-nav-bar-social .contact-buttons,
  .mobile-nav-social .contact-buttons {
    gap: 0;
  }

  .section-header h2 {
    font-size: 1.5rem;
  }

  .hero,
  .hero-slides-wrap {
    min-height: var(--page-hero-height-mobile);
    height: var(--page-hero-height-mobile);
  }

  .hero-bg {
    background-position: center;
  }

  .page-hero h1 {
    font-size: 1.5rem;
  }

  .page-hero--photo {
    height: var(--page-hero-height-mobile);
    min-height: var(--page-hero-height-mobile);
    max-height: var(--page-hero-height-mobile);
    padding: 72px 0 64px;
  }

  .page-hero--photo > .page-hero-bg:not(.page-hero-bg--motion-img) {
    top: 0;
    bottom: 0;
    transform: none;
  }

  .page-hero--photo h1,
  .page-hero--with-highlights .page-hero-highlight-head h1 {
    font-size: var(--banner-title-size-mobile);
  }

  .page-hero-kicker {
    font-size: var(--banner-kicker-size-mobile);
    letter-spacing: 0.1em;
    margin-bottom: 14px;
    padding: 7px 12px;
  }

  .page-hero-lead,
  .page-hero--photo .page-hero-lead,
  .page-hero--with-highlights .page-hero-highlight-head .page-hero-lead,
  .blog-hero-lead {
    display: none !important;
  }

  .page-hero--egitim > .page-hero-bg,
  .page-hero--egitim .page-hero-bg {
    background-position: center center;
  }

  .page-hero--photo::after,
  .page-hero--with-highlights.page-hero--photo::after {
    display: none !important;
    content: none !important;
    height: 0 !important;
    min-height: 0 !important;
    max-height: 0 !important;
    background: none !important;
    box-shadow: none !important;
  }

  .page-hero--hakkimizda > .page-hero-bg,
  .page-hero--hakkimizda .page-hero-bg {
    background-position: 68% center !important;
    top: 0 !important;
    bottom: 0 !important;
  }

  .logo img,
  .logo .header-logo {
    max-height: 44px;
    max-width: min(132px, 36vw);
  }

  .site-header.scrolled .logo img,
  .site-header.scrolled .logo .header-logo {
    max-height: 38px;
    max-width: min(116px, 32vw);
  }
}

@media (max-width: 400px) {
  .btn-lang-toggle {
    padding: 8px 9px;
    font-size: 0.68rem;
    min-width: 82px;
    min-height: 40px;
    gap: 4px;
  }

  .btn-lang-toggle .lang-icon {
    font-size: 0.8rem;
  }
}

/* Safe area for notched phones */
@supports (padding: max(0px)) {
  body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }

  .wa-chat-widget {
    bottom: max(76px, calc(60px + env(safe-area-inset-bottom)));
    right: max(16px, env(safe-area-inset-right));
  }

  .scroll-top-btn {
    bottom: max(20px, env(safe-area-inset-bottom));
    left: max(16px, env(safe-area-inset-left));
    right: auto;
  }
}

/* Touch targets */
.faq-q,
.placement-opt,
.mobile-menu-btn {
  min-height: 44px;
  min-width: 44px;
}

.hero-dot {
  min-height: 8px;
  min-width: 8px;
}

/* === Mobil UX iyileştirmeleri (20260801) === */
@media (max-width: 768px) {
  :root {
    --page-hero-height-mobile: clamp(220px, 52vw, 360px);
    --banner-title-size-mobile: 1.65rem;
  }

  body {
    padding-top: calc(var(--site-header-offset, 60px) + env(safe-area-inset-top, 0px));
  }

  main,
  .exam-guide-body,
  .content-block,
  section.page-content {
    min-width: 0;
    max-width: 100%;
  }

  img,
  video,
  iframe,
  svg {
    max-width: 100%;
  }

  .hero-content {
    padding-left: 20px;
    padding-right: 20px;
  }

  .hero-content .hero-animate {
    max-width: 100%;
    padding-inline: 4px;
  }

  .hero-arrow,
  .hero-arrows {
    display: none !important;
  }

  .home-about,
  .home-announcements,
  .video-section,
  .testimonials-section,
  .home-blog-section,
  .faq-home,
  .features,
  .page-content {
    padding-top: clamp(36px, 8vw, 52px);
    padding-bottom: clamp(36px, 8vw, 52px);
  }

  .home-about-layout {
    gap: 20px;
  }

  /* Neden Biz / Hakkımızda — mobil tek sütun (styles.css !important 2 kolon ezmesin) */
  body.home-page #home-about .home-about-layout,
  #about-hero-intro .home-about-layout,
  #placement-about-intro .home-about-layout,
  #exam-guide-about-intro .home-about-layout,
  body.home-page .home-about > .container.home-about-layout,
  .about.about-hero-intro > .container.home-about-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: min(1200px, calc(100% - 32px)) !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    gap: 20px !important;
    align-items: start !important;
  }

  body.home-page #home-about .home-about-content,
  body.home-page .home-about-content,
  #about-hero-intro .home-about-content,
  #about-hero-intro .about-content,
  #placement-about-intro .home-about-content,
  #exam-guide-about-intro .home-about-content,
  .about.about-hero-intro .home-about-content,
  .about.about-hero-intro .about-content {
    grid-column: 1 !important;
    justify-self: stretch !important;
    align-self: start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  body.home-page #home-about .home-about-visual:not(.about-visual--single),
  #about-hero-intro .home-about-visual:not(.about-visual--single),
  body.home-page .home-about-visual.about-visual:not(.about-visual--single),
  .about.about-hero-intro .home-about-visual:not(.about-visual--single) {
    grid-column: 1 !important;
    justify-self: center !important;
    width: 100% !important;
    max-width: min(100%, 320px) !important;
    height: auto !important;
    min-height: 0 !important;
    margin-inline: auto !important;
  }

  body.home-page #home-about .home-about-visual.about-visual--single,
  #about-hero-intro .home-about-visual.about-visual--single,
  #placement-about-intro .home-about-visual.about-visual--single,
  #exam-guide-about-intro .home-about-visual.about-visual--single,
  .about.about-hero-intro .home-about-visual.about-visual--single {
    grid-column: 1 !important;
    justify-self: center !important;
    width: 100% !important;
    max-width: min(100%, 380px) !important;
    max-height: min(78vh, 580px) !important;
    height: auto !important;
    min-height: 0 !important;
    margin-inline: auto !important;
  }

  #about-hero-intro .home-about-visual.about-visual--single {
    margin-top: 1.25rem !important;
  }

  body.home-page #home-about .home-about-visual-link,
  #about-hero-intro .home-about-visual-link,
  body.home-page #home-about .about-visual-media,
  #about-hero-intro .about-visual-media {
    height: auto !important;
    min-height: 0 !important;
  }

  body.home-page #home-about .about-visual-media,
  #about-hero-intro .about-visual-media,
  body.home-page #home-about .home-about-visual img:not(.about-visual-portrait),
  #about-hero-intro .home-about-visual img:not(.about-visual-portrait),
  body.home-page #home-about .about-visual-media img,
  #about-hero-intro .about-visual-media img {
    aspect-ratio: 9 / 16 !important;
    height: auto !important;
    width: 100% !important;
  }

body.home-page #home-about .about-visual--home .about-visual-portrait {
  aspect-ratio: auto !important;
  height: auto !important;
  width: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  transform: none !important;
  border-radius: 0 !important;
}

  body.home-page #home-about .about-visual--home .about-visual-single,
  #about-hero-intro .about-visual--single .about-visual-single {
    border-radius: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }

  body.home-page #home-about .about-visual-stack img,
  #about-hero-intro .about-visual-stack img {
    aspect-ratio: auto !important;
    height: 100% !important;
    width: 100% !important;
    object-fit: cover !important;
  }

  #about-hero-intro .home-about-lead,
  #about-hero-intro .home-about-body p,
  #about-hero-intro #about-text,
  #about-hero-intro .about-paragraphs p,
  body.home-page #home-about .home-about-lead,
  body.home-page #home-about .home-about-body p,
  body.home-page #home-about #home-about-text {
    text-align: left !important;
    text-align-last: left !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }

  .about.about-hero-intro,
  #about-hero-intro {
    overflow-x: hidden;
  }

  .about.about-hero-intro > .container,
  #about-hero-intro > .container {
    min-width: 0;
    max-width: 100%;
  }

  .about-stats-section > .container,
  .about-lower-panel > .container,
  .about-mvv > .container,
  .about-values-section > .container {
    width: min(1200px, calc(100% - 32px)) !important;
    max-width: 100% !important;
    min-width: 0;
    box-sizing: border-box;
  }

  .about-content,
  .about-paragraphs,
  .about-mvv-card,
  .about-stat-card {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: break-word;
    word-break: break-word;
  }

  .ceo-box {
    max-width: 100%;
    min-width: 0;
  }

  .home-about-title {
    font-size: 1.65rem;
    line-height: 1.2;
  }

  .home-about-lead {
    font-size: 1rem;
  }

  .home-about-body p {
    font-size: 0.98rem;
    line-height: 1.7;
  }

  /* Dekoratif şekiller yazı alanına binmesin */
  body.home-page .section-has-photo > .section-deco {
    z-index: 0 !important;
  }

  body.home-page .section-deco-host > .container {
    z-index: 3;
  }

  body.home-page .home-about-content,
  #about-hero-intro .home-about-content,
  #about-hero-intro .about-content {
    position: relative;
    z-index: 1;
    isolation: isolate;
    padding: 4px 2px;
  }

  body.home-page .home-about-content::before,
  #about-hero-intro .home-about-content::before,
  #about-hero-intro .about-content::before {
    content: "";
    position: absolute;
    inset: -12px -8px;
    z-index: -1;
    border-radius: 14px;
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.94) 0%,
      rgba(255, 255, 255, 0.86) 100%
    );
    pointer-events: none;
  }

  body.home-page .section-deco--auto .deco-pos-tc,
  body.home-page .section-deco--auto .deco-pos-bc,
  body.home-page .section-deco--auto .deco-pos-ml,
  body.home-page .section-deco--auto .deco-pos-mr,
  body.home-page .section-deco--auto .deco-pos-ml-deep,
  body.home-page .section-deco--auto .deco-pos-mr-deep,
  body.home-page .section-deco--auto .deco-pos-center,
  body.home-page .section-deco--auto .deco-zigzag,
  body.home-page .section-deco--auto .deco-cross,
  body.home-page .section-deco--auto .deco-line,
  body.home-page .section-deco--auto .deco-arc,
  body.home-page .section-deco--auto .deco-pill,
  body.home-page .section-deco--auto .deco-orbit,
  body.home-page .section-deco--auto .deco-ring--md,
  body.home-page .section-deco--auto .deco-ring--lg,
  body.home-page .section-deco--auto .deco-pos-tl:not([class*="-far"]),
  body.home-page .section-deco--auto .deco-pos-tr:not([class*="-far"]),
  body.home-page .section-deco--auto .deco-pos-bl:not([class*="-far"]),
  body.home-page .section-deco--auto .deco-pos-br:not([class*="-far"]) {
    display: none !important;
  }

  body.home-page .section-deco--auto .deco-pos-tl-far,
  body.home-page .section-deco--auto .deco-pos-tr-far,
  body.home-page .section-deco--auto .deco-pos-bl-far,
  body.home-page .section-deco--auto .deco-pos-br-far {
    opacity: 0.2 !important;
    transform: scale(0.62);
  }

  .section-header {
    margin-bottom: 22px;
  }

  .section-header h2 {
    font-size: 1.55rem;
    line-height: 1.25;
  }

  .testimonials.page-content .testimonials-grid {
    grid-template-columns: 1fr !important;
  }

  .courses-catalog-grid {
    grid-template-columns: 1fr !important;
    gap: 14px;
  }

  .courses-sidebar-wrap {
    margin-left: 0;
    width: 100%;
  }

  .courses-sidebar {
    margin-left: 0;
    position: static;
    top: auto;
    border-radius: 16px;
    padding: 14px 12px;
  }

  .courses-sidebar-section-label {
    margin: 8px 0 6px;
    padding: 0 4px;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #94a3b8;
    border-radius: 0;
    background: none;
  }

  .courses-sidebar-sublist {
    padding-left: 10px;
    border-left: 2px solid rgba(212, 175, 55, 0.55);
    gap: 8px;
    margin-top: 8px;
  }

  .courses-sidebar-all,
  .courses-sidebar-item {
    align-items: flex-start;
    padding: 12px 14px;
    min-height: 48px;
  }

  .courses-sidebar-all-icon,
  .courses-sidebar-item-icon-wrap {
    align-self: flex-start;
    margin-top: 0.12em;
    flex-shrink: 0;
  }

  .courses-sidebar-item-body {
    align-self: center;
    min-width: 0;
  }

  .courses-sidebar-item-chevron-wrap {
    align-self: center;
    flex-shrink: 0;
  }

  .courses-sidebar-item-label {
    font-size: 0.74rem;
    line-height: 1.25;
    text-transform: uppercase;
    letter-spacing: 0.045em;
    font-weight: 700;
  }

  .courses-sidebar-item-meta {
    font-size: 0.6875rem;
    color: #94a3b8;
  }

  .courses-sidebar-item-chevron {
    opacity: 1;
    width: 18px;
    height: 18px;
  }

  .exam-guide-logos {
    padding: 28px 0 18px;
  }

  .exam-guide-intro {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .exam-guide-intro-text {
    font-size: 0.94rem;
    line-height: 1.65;
  }

  .exam-guide-body > .exam-guide-layout {
    padding-top: 0;
    padding-bottom: 72px;
  }

  .exam-detail-card {
    border-radius: 16px;
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.08);
  }

  .exam-detail-header {
    align-items: center;
  }

  .contact-page .contact-panel-box {
    padding: 16px 14px 8px;
    border-radius: 18px;
  }

  .contact-form-card {
    padding: 20px 16px;
    border-radius: 18px;
  }

  .contact-highlights--hero,
  .faq-highlights--hero {
    display: none !important;
  }

  .page-hero--iletisim.page-hero--with-highlights,
  .page-hero--sss.page-hero--with-highlights {
    height: auto;
    min-height: var(--page-hero-height-mobile);
    max-height: none;
    padding: clamp(56px, 14vw, 72px) 0 clamp(40px, 10vw, 56px);
    justify-content: center;
  }

  .page-hero--iletisim.page-hero--with-highlights .page-hero-lead,
  .page-hero--sss.page-hero--with-highlights .page-hero-lead {
    display: none !important;
  }

  .page-hero--with-highlights .page-hero-highlight-head {
    padding-inline: 12px;
  }

  body.site-germany-bg .exam-detail-card,
  body.site-germany-bg .feature-card,
  body.site-germany-bg .course-card,
  body.site-germany-bg .blog-card,
  body.site-germany-bg .testimonial-card,
  body.site-germany-bg .contact-panel-box,
  body.site-germany-bg .contact-form-card,
  body.site-germany-bg .faq-item,
  body.site-germany-bg .placement-card {
    background: rgba(255, 255, 255, 0.94) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }

  body.site-germany-bg .faq-home.faq--anthracite .faq-home-list .faq-item,
  body.site-germany-bg .faq-home.faq--anthracite .faq-home-list .faq-item:not(.open),
  body.site-germany-bg .faq-home.faq--anthracite .faq-home-list .faq-q,
  body.site-germany-bg .faq-home.faq--anthracite .faq-home-list .faq-item:not(.open) .faq-q {
    background: #f0e6d8 !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .wa-chat-widget {
    bottom: max(72px, calc(56px + env(safe-area-inset-bottom)));
    right: max(14px, env(safe-area-inset-right));
  }

  #site-footer {
    padding-bottom: max(20px, env(safe-area-inset-bottom));
  }

  body.home-page #site-footer {
    padding-bottom: 0;
  }
}

@media (max-width: 480px) {
  .container {
    width: min(1200px, calc(100% - 28px));
  }

  .exam-guide-logos .exams-logo-rows--puzzle {
    gap: 8px;
  }

  .exam-guide-nav {
    gap: 6px;
    padding: 8px;
  }

  .exam-guide-nav .exam-guide-tab {
    padding: 7px 8px;
    font-size: 0.68rem;
  }

  .exam-guide-nav {
    --exam-nav-logo-slot-w: 46px;
    --exam-nav-logo-slot-h: 28px;
    --exam-nav-logo-h: 18px;
    --exam-nav-logo-max-w: 42px;
  }

  .exam-guide-tab-label {
    max-width: 7.5rem;
  }
}

@media (max-width: 768px) {
  #about-hero-intro .about-visual--single.home-about-visual,
  #home-about .about-visual--single.home-about-visual {
    max-width: min(100%, var(--about-hero-visual-width, 340px)) !important;
    width: min(100%, var(--about-hero-visual-width, 340px)) !important;
  }

  #about-hero-intro .about-visual--single .about-visual-portrait,
  #home-about .about-visual--single .about-visual-portrait,
  #exam-guide-about-intro .about-visual--single .about-visual-portrait {
    aspect-ratio: auto !important;
    height: auto !important;
    object-fit: contain !important;
  }

  #placement-about-intro .about-visual--home .about-visual-portrait {
    aspect-ratio: auto !important;
    height: auto !important;
    object-fit: contain !important;
  }
}

/* iOS zoom / yatay telefon / güvenli alan — ek mobil cilası */
@media (max-width: 768px) {
  input,
  select,
  textarea {
    font-size: 16px;
  }

  .btn,
  .btn-primary,
  .btn-outline,
  .mobile-menu-btn,
  .site-search-btn,
  a.btn {
    min-height: 44px;
    touch-action: manipulation;
  }

  .site-footer {
    padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px));
  }

  .wa-chat-widget,
  .scroll-top-btn {
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
  }

  .hero-slide {
    min-height: 0;
  }

  .page-hero,
  .page-hero--photo {
    min-height: clamp(200px, 48vw, 300px);
  }

  table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 768px) and (orientation: landscape) and (max-height: 500px) {
  .hero,
  .hero-slides-wrap {
    min-height: var(--page-hero-height-mobile);
    height: var(--page-hero-height-mobile);
  }

  .page-hero,
  .page-hero--photo {
    min-height: 160px;
  }

  .hero-content {
    padding-top: 16px;
    padding-bottom: 20px;
  }
}


/* ==========================================================================
   ENHANCED MOBILE POLISH (KURAM AKADEMI 2026)
   - Zero regression on Desktop
   - Seamless fluid mobile adaptation (320px - 768px)
   ========================================================================== */

@media (max-width: 680px) {
  /* 1. Announcements Grid Mobile Single Column */
  .home-announcements-grid,
  .announcements-grid,
  .home-announcements .announcements-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    max-width: 400px !important;
    width: 100% !important;
    margin-inline: auto !important;
    gap: 20px !important;
  }

  .home-announcement-card,
  .announcement-card {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }

  /* 2. Placement Exam Cards Mobile */
  .placement-exam-grid,
  .placement-exam-tiles-grid,
  .placement-exam-list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    max-width: 420px !important;
    width: 100% !important;
    margin-inline: auto !important;
    gap: 18px !important;
  }

  .placement-exam-tile {
    width: 100% !important;
    aspect-ratio: 16 / 13 !important;
  }

  .placement-exam-tile-media img {
    object-fit: cover !important;
    object-position: left center !important;
  }

  .placement-exam-tile-body strong {
    font-size: 1.15rem !important;
    line-height: 1.3 !important;
  }

  .placement-exam-tile-lead {
    font-size: 0.82rem !important;
  }
}

@media (max-width: 768px) {
  /* 3. Smooth Non-Jittery Backgrounds on Mobile */
  body.about-page .about-lower-panel,
  .placement-test.page-content,
  body.site-germany-bg section.placement-test.page-content {
    background-attachment: scroll, scroll !important;
    background-size: auto, cover !important;
    background-position: center top, center center !important;
  }

  /* 4. Filter Tabs Momentum Scrolling */
  .course-filters,
  .catalog-filter-bar,
  .exam-tabs-nav,
  .pricing-tabs-nav {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 8px !important;
    padding-bottom: 8px !important;
    scrollbar-width: none !important;
  }

  .course-filters::-webkit-scrollbar,
  .catalog-filter-bar::-webkit-scrollbar {
    display: none !important;
  }

  /* 5. Mobile Video Container */
  .home-video-wrapper,
  .video-container {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
  }

  /* 6. Form Inputs iOS Auto-Zoom Prevention */
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  select,
  textarea {
    font-size: 16px !important;
  }

  /* 7. Global Horizontal Overflow Guard */
  html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
}


/* ==========================================================================
   WHY US & ABOUT INTRO 18PX TYPOGRAPHY ENHANCEMENT
   ========================================================================== */
#home-about .home-about-lead,
#home-about .home-about-body p,
#home-about #home-about-text,
#home-about .home-about-body,
#about-hero-intro .home-about-lead,
#about-hero-intro .home-about-body p,
#about-hero-intro #about-hero-text,
#about-hero-intro .about-intro-body p,
#placement-about-intro .home-about-lead,
#placement-about-intro .home-about-body p,
#placement-about-intro #placement-about-text,
#exam-guide-about-intro .home-about-lead,
#exam-guide-about-intro .home-about-body p,
#exam-guide-about-intro #exam-guide-about-text,
.home-about-lead,
.home-about-body p {
  font-size: 18px !important;
  line-height: 1.68 !important;
}

@media (max-width: 640px) {
  #home-about .home-about-lead,
  #home-about .home-about-body p,
  #about-hero-intro .home-about-lead,
  #about-hero-intro .home-about-body p,
  #placement-about-intro .home-about-lead,
  #placement-about-intro .home-about-body p,
  .home-about-lead,
  .home-about-body p {
    font-size: 16.5px !important;
    line-height: 1.62 !important;
  }
}


/* ==========================================================================
   RESTORED BALANCED TYPOGRAPHY & WHY US POSTER
   ========================================================================== */
#home-about .home-about-lead,
#home-about .home-about-body p,
#home-about #home-about-text,
#about-hero-intro .home-about-lead,
#about-hero-intro .home-about-body p,
#about-hero-intro #about-hero-text,
#placement-about-intro .home-about-lead,
#placement-about-intro .home-about-body p,
#placement-about-intro #placement-about-text,
#exam-guide-about-intro .home-about-lead,
#exam-guide-about-intro .home-about-body p {
  font-size: 0.95rem !important;
  line-height: 1.65 !important;
  color: #1a1a1a !important;
  font-weight: 500 !important;
  margin: 0 0 10px !important;
}

#home-about .home-about-visual,
#about-hero-intro .home-about-visual,
#placement-about-intro .home-about-visual,
#exam-guide-about-intro .home-about-visual,
.about-visual-single,
.about-visual-single-link {
  border-radius: 28px !important;
  overflow: hidden !important;
  box-shadow: 0 18px 42px rgba(26, 26, 26, 0.16) !important;
  background: #16181c !important;
  display: block !important;
}

#home-about .about-visual-portrait,
#about-hero-intro .about-visual-portrait,
#placement-about-intro .about-visual-portrait,
#exam-guide-about-intro .about-visual-portrait,
.about-visual-portrait {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 28px !important;
  display: block !important;
}


/* ==========================================================================
   ANNOUNCEMENT CARDS COMPACT & NO BLACK EDGES FIX
   ========================================================================== */
.home-announcement-card,
.home-announcement-card--media-only {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  aspect-ratio: 700 / 790 !important;
  position: relative !important;
  z-index: 1 !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  background: transparent !important;
  border: none !important;
  box-shadow: 0 14px 36px rgba(26, 26, 26, 0.12) !important;
  color: #fff !important;
  text-decoration: none !important;
  transition: transform 0.28s ease, box-shadow 0.28s ease !important;
}

.home-announcement-media,
.home-announcement-card--media-only .home-announcement-media {
  position: relative !important;
  flex: 1 1 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 22px !important;
}

.home-announcement-media img,
.home-announcement-card--media-only .home-announcement-media img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  border-radius: 22px !important;
  transition: transform 0.35s ease !important;
}

.home-announcement-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 20px 48px rgba(26, 26, 26, 0.2) !important;
}

@media (max-width: 680px) {
  .home-announcements-grid {
    max-width: 400px !important;
    gap: 16px !important;
  }
  .home-announcement-card,
  .home-announcement-card--media-only {
    aspect-ratio: 700 / 790 !important;
  }
}





/* ==========================================================================
   HOMEPAGE HERO SLIDER EXACT PIXEL-PERFECT 2077 / 757 RATIO FIT
   - Matches the exact 2077x757 banner dimensions
   - Zero white space / zero letterboxing
   - Full-bleed sharp display with zero image distortion or cutoff
   ========================================================================== */

@media (max-width: 768px) {
  body.home-page .hero,
  body.home-page #hero-slides,
  body.home-page .hero-slides-wrap,
  .hero-slider,
  .home-hero-slider {
    margin-top: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    width: 100% !important;
    aspect-ratio: 2077 / 757 !important; /* Exact pixel ratio of all 6 banner designs */
    padding-bottom: 0 !important;
    position: relative !important;
    background: transparent !important;
    overflow: hidden !important;
  }

  body.home-page .hero-slide {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }

  body.home-page .hero-slide-link {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
  }

  body.home-page .hero-bg,
  body.home-page .hero-bg picture {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }

  body.home-page .hero-bg img,
  body.home-page .hero-bg-img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: fill !important; /* Stretches 1:1 with the exact 2077x757 aspect ratio */
    object-position: center center !important;
    max-width: 100% !important;
    max-height: 100% !important;
    border: none !important;
  }

  /* Compact Dots bar below or inside slider */
  body.home-page .hero-dots-bar {
    position: relative !important;
    height: 24px !important;
    margin: 6px auto 10px !important;
    bottom: auto !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
  }

  body.home-page .hero-dots {
    position: relative !important;
    bottom: auto !important;
    gap: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.home-page .hero-dot {
    width: 7px !important;
    height: 7px !important;
    border-radius: 50% !important;
    background: rgba(0, 0, 0, 0.25) !important;
    border: none !important;
    transition: all 0.2s ease !important;
    padding: 0 !important;
  }

  body.home-page .hero-dot.active {
    width: 18px !important;
    border-radius: 5px !important;
    background: #8b182d !important;
  }
}

/* Tablet (769px - 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
  body.home-page .hero,
  body.home-page #hero-slides,
  body.home-page .hero-slides-wrap {
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 2077 / 757 !important;
    width: 100% !important;
    padding-bottom: 0 !important;
  }

  body.home-page .hero-bg img,
  body.home-page .hero-bg-img {
    object-fit: fill !important;
    object-position: center center !important;
  }
}


/* ==========================================================================
   Hakkımızda & Neden Biz Görsel Köşe Yuvarlama (Tam Anasayfa ile Birebir 28px)
   ========================================================================== */
#about-hero-intro .home-about-visual,
#about-hero-intro .about-visual,
#about-hero-intro .about-visual-single,
#about-hero-intro .about-visual-single picture,
#about-hero-intro .about-visual-single img,
#about-hero-intro .about-visual-portrait,
.about-hero-intro .home-about-visual,
.about-hero-intro .about-visual,
.about-hero-intro .about-visual-single,
.about-hero-intro .about-visual-single picture,
.about-hero-intro .about-visual-single img,
.about-hero-intro .about-visual-portrait,
.page-hero--hakkimizda ~ #about-hero-intro .home-about-visual,
.page-hero--hakkimizda ~ #about-hero-intro .about-visual-single,
.page-hero--hakkimizda ~ #about-hero-intro .about-visual-portrait,
body.about-page #about-hero-intro .about-visual-portrait {
  border-radius: 28px !important;
  overflow: hidden !important;
  -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
}
