@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Inter:wght@300;400;500;600&family=Google+Sans+Flex:wght@400;500;600;700;800&display=swap');

@font-face {
    font-family: 'Mont';
    src: url('../fonts/Mont-SemiBold.woff2') format('woff2'),
         url('../fonts/Mont-SemiBold.woff') format('woff'),
         url('../fonts/Mont-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

:root {
    --primary-color: #006ab3;
    --secondary-color: #0d1b2a;
    --text-color: #1a1a1a;
    --text-light: #777777;
    /* Several pages reference --text-muted (a slightly different name for
       the same "secondary text" role as --text-light) — defining it here
       fixes every one of those usages at once instead of hunting each down. */
    --text-muted: #777777;
    --white: #ffffff;
    --glass-bg: rgba(255, 255, 255, 0.15);
    --glass-border: rgba(255, 255, 255, 0.2);
    --font-heading: 'Outfit', sans-serif;
    --font-body: 'Inter', sans-serif;
    --font-pilat: 'Google Sans Flex', sans-serif;
    --transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-body);
    color: var(--text-color);
    background-color: var(--white);
    line-height: 1.6;
    overflow-x: hidden;
}

a {
    text-decoration: none;
    color: inherit;
}

ul {
    list-style: none;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    line-height: 1.2;
}

.container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 5%;
}

/* --- HEADER --- */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 30px 0;
    z-index: 1000;
    transition: var(--transition);
}

.header.scrolled {
    padding: 15px 0;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(10px);
}

.header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo img {
    height: 68px;
    object-fit: contain;
}

.nav-menu {
    display: flex;
    gap: 40px;
}

.nav-menu a {
    color: var(--white);
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 15px;
    position: relative;
    transition: var(--transition);
}

.nav-menu a::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--white);
    transition: var(--transition);
}

.nav-menu a:hover::after {
    width: 100%;
}

/* Dropdown Menu */
.has-dropdown {
    position: relative;
    padding-bottom: 20px; /* Bridge gap for hover */
    margin-bottom: -20px;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: -20px;
    background-color: #0f1c2a; /* Dark corporate blue from image */
    min-width: 200px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
    box-shadow: 0 15px 30px rgba(0,0,0,0.2);
    border-radius: 4px;
    overflow: hidden;
    padding: 10px 0;
    z-index: 1000;
}

.has-dropdown:hover .dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-menu li {
    display: block;
}

.dropdown-menu a {
    display: block;
    padding: 12px 25px;
    font-size: 14px;
    font-weight: 400;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    transition: all 0.2s ease;
}

.dropdown-menu li:last-child a {
    border-bottom: none;
}

.dropdown-menu a:hover {
    background-color: rgba(255,255,255,0.05);
    padding-left: 30px;
}

.dropdown-menu a::after {
    display: none; /* Hide underline effect for dropdown items */
}

/* --- PRELOADER --- */
.preloader {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background-color: var(--primary-color);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.8s cubic-bezier(0.77, 0, 0.175, 1), opacity 0.8s ease;
}

.preloader.loaded {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

.preloader-content {
    text-align: center;
}

.preloader-logo {
    height: 42px;
    width: auto;
    max-width: 220px;
    object-fit: contain;
    margin-bottom: 20px;
}

.preloader-bar {
    width: 200px;
    height: 2px;
    background: rgba(255,255,255,0.1);
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}

.preloader-progress {
    position: absolute;
    top: 0; left: 0; height: 100%;
    background: var(--white);
    width: 0%;
    transition: width 0.3s ease;
}

/* --- HEADER RIGHT & TOGGLE --- */
.header-right {
    display: flex;
    align-items: center;
    gap: 30px;
}

.lang-selector {
    color: var(--white);
    font-family: var(--font-heading);
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.2);
    padding: 8px 15px;
    border-radius: 20px;
    backdrop-filter: blur(5px);
    transition: var(--transition);
}
.lang-selector:hover {
    background: rgba(255, 255, 255, 0.3);
}

.menu-toggle {
    background: none;
    border: none;
    cursor: pointer;
    /* Masaüstünde üst menü (.desktop-nav) zaten görünür durumda —
       hamburger sadece .desktop-nav'ın gizlendiği mobil/tablet
       genişliklerinde (bkz. @media max-width:1024px altındaki
       "display:flex" override'ı) görünmeli. */
    display: none;
    flex-direction: column;
    gap: 6px;
    padding: 10px;
    z-index: 2000;
}

.menu-line {
    display: block;
    width: 30px;
    height: 2px;
    background-color: var(--white);
    transition: all 0.3s ease;
}

.menu-toggle.active .menu-line:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}

.menu-toggle.active .menu-line:nth-child(2) {
    transform: translateY(-8px) rotate(-45deg);
}

/* --- OVERLAY MENU ---
   Eskiden tüm ekranı kaplayan dairesel bir açılış efektiyle (clip-path
   circle) geliyordu. Artık ekranın SAĞINDA, tam genişlikte olmayan, kaydırarak
   açılan dar bir panel (drawer) — arkasında da tıklanınca kapatan yarı
   saydam bir karartı katmanı var. */
.overlay-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(3, 10, 20, 0.55);
    z-index: 1490;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease;
}

.overlay-backdrop.active {
    opacity: 1;
    visibility: visible;
}

.overlay-menu {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: min(440px, 88vw);
    background-color: var(--primary-color);
    z-index: 1500;
    display: flex;
    align-items: center;
    box-shadow: -20px 0 60px rgba(0,0,0,0.25);
    transform: translateX(100%);
    transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
}

.overlay-menu.active {
    transform: translateX(0);
}

.overlay-close {
    position: absolute;
    top: 24px;
    right: 30px;
    background: transparent;
    border: none;
    color: var(--white);
    font-size: 40px;
    font-weight: 300;
    cursor: pointer;
    z-index: 2000;
    transition: transform 0.3s ease;
}

.overlay-close:hover {
    transform: rotate(90deg);
}

.overlay-menu-inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    padding: 80px 40px 40px;
    overflow-y: auto;
}

.overlay-nav {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.overlay-link {
    font-family: var(--font-pilat);
    font-size: 26px;
    font-weight: 700;
    color: var(--white);
    display: flex;
    align-items: center;
    gap: 14px;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.4s ease;
    text-transform: uppercase;
    padding: 8px 0;
}

.overlay-dropdown {
    display: flex;
    flex-direction: column;
}

.overlay-dropdown .arr {
    font-size: 16px;
    color: var(--white);
    transition: transform 0.3s ease;
}

.overlay-dropdown.active .arr {
    transform: rotate(180deg);
}

.overlay-submenu {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-left: 30px;
    margin-top: 10px;
    margin-bottom: 10px;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 0.4s ease;
}

.overlay-dropdown.active .overlay-submenu {
    max-height: 400px;
    opacity: 1;
}

.overlay-submenu a {
    font-family: 'Mont', sans-serif;
    font-size: 16px;
    color: rgba(255,255,255,0.7);
    transition: color 0.3s ease;
}

.overlay-submenu a:hover {
    color: var(--white);
}

.overlay-menu.active .overlay-link {
    opacity: 1;
    transform: translateY(0);
}

.overlay-menu.active .overlay-link:nth-child(1) { transition-delay: 0.2s; }
.overlay-menu.active .overlay-link:nth-child(2) { transition-delay: 0.3s; }
.overlay-menu.active .overlay-link:nth-child(3) { transition-delay: 0.4s; }
.overlay-menu.active .overlay-link:nth-child(4) { transition-delay: 0.5s; }
.overlay-menu.active .overlay-link:nth-child(5) { transition-delay: 0.6s; }

.overlay-link:hover {
    color: rgba(255,255,255,0.5);
}

.overlay-num {
    font-family: var(--font-body);
    font-size: 16px;
    color: rgba(255,255,255,0.3);
}

.overlay-footer {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    border-top: 1px solid rgba(255,255,255,0.15);
    padding-top: 30px;
    opacity: 0;
    transition: opacity 0.5s ease 0.8s;
}

.overlay-menu.active .overlay-footer {
    opacity: 1;
}

.overlay-contact p {
    color: rgba(255,255,255,0.6);
    margin-bottom: 5px;
}

.overlay-social {
    display: flex;
    gap: 20px;
}
.overlay-social a {
    color: var(--white);
    font-family: var(--font-heading);
}

/* --- HERO SECTION --- */
.hero {
    position: relative;
    height: 100vh;
    min-height: 800px;
    color: var(--white);
    overflow: hidden;
}

.hero::before {
    display: none;
}

.hero-slides {
    position: relative;
    width: 100%;
    height: 100%;
    touch-action: pan-y;
    cursor: grab;
    user-select: none;
}

.hero-slides:active {
    cursor: grabbing;
}

.hero-slide {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    background-size: cover;
    background-position: center;
    transform: translateX(100%);
    transition: transform 1s cubic-bezier(0.65, 0, 0.35, 1);
    z-index: 1;
}

.hero-slide.active {
    transform: translateX(0%);
    z-index: 3;
}

.hero-video-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.hero-progress {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 28px;
    z-index: 6;
    display: flex;
    gap: 10px;
    padding: 0 60px;
}

.hero-progress-bar {
    position: relative;
    flex: 1;
    height: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.hero-progress-track {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.35);
}

.hero-progress-fill {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 1px;
    width: 0%;
    background: var(--white);
    transition: width linear, height 0.2s ease;
}

.hero-progress-bar.done .hero-progress-fill,
.hero-progress-bar.active .hero-progress-fill {
    height: 2px;
}

.hero .container {
    position: relative;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: flex-start;
    padding-top: 24vh;
}

.hero-content {
    max-width: 60%;
    position: relative;
    z-index: 2;
}

.hero-title {
    font-family: var(--font-pilat);
    font-weight: 700;
    font-size: 65px;
    margin-bottom: 20px;
    letter-spacing: -1px;
    line-height: 1.1;
}

.hero-desc {
    font-size: 18px;
    margin-bottom: 40px;
    font-weight: 300;
    opacity: 0.9;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 25px;
    background-color: rgba(255, 255, 255, 0.85);
    color: #3b5973;
    font-family: var(--font-pilat);
    font-weight: 700;
    border-radius: 6px;
    transition: var(--transition);
    cursor: pointer;
    border: none;
    font-size: 14px;
}

.btn:hover {
    background-color: #eee;
}

/* Pins and Tooltips */
.pin-anchor {
    position: absolute;
    z-index: 10;
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.pin-anchor.fade-out {
    opacity: 0;
    transform: translateY(-20px);
    pointer-events: none;
}

@keyframes pulse-dot {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6); }
    10% { transform: scale(1.4); box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.2); }
    22% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
    32% { transform: scale(1.4); box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.2); }
    44%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

.pin-dot {
    width: 8px;
    height: 8px;
    background-color: var(--white);
    border-radius: 50%;
    position: absolute;
    top: -4px;
    left: -4px;
    animation: pulse-dot 2.4s ease-in-out infinite;
}

/* Elbow leader line: short diagonal near the dot, then a straight run into the box (no gap) */
.pin-line-diag {
    position: absolute;
    background-color: rgba(255, 255, 255, 0.85);
    height: 1px;
    width: 57px;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    transform: rotate(45deg);
}

.pin-line-h {
    position: absolute;
    background-color: rgba(255, 255, 255, 0.85);
    height: 1px;
    width: 90px;
    top: 40px;
    left: 40px;
}

.pin-info {
    position: absolute;
    top: 40px;
    left: 130px;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    padding: 6px 12px;
    color: var(--white);
    width: max-content;
    max-width: 260px;
}

.pin-info h4 {
    font-family: var(--font-pilat);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
    color: var(--white);
}

.pin-info p {
    font-family: var(--font-body);
    font-size: 12.5px;
    line-height: 1.6;
    color: rgba(255,255,255,0.85);
    margin: 0;
}

/* Pin Direction Variants (default = br: down-right, styled above) */
.pin-anchor.pin-dir-bl .pin-line-diag { transform: rotate(135deg); }
.pin-anchor.pin-dir-bl .pin-line-h { left: auto; right: 40px; }
.pin-anchor.pin-dir-bl .pin-info { left: auto; right: 130px; text-align: right; }

.pin-anchor.pin-dir-tr .pin-line-diag { transform: rotate(-45deg); }
.pin-anchor.pin-dir-tr .pin-line-h { top: auto; bottom: 40px; }
.pin-anchor.pin-dir-tr .pin-info { top: auto; bottom: 40px; }

.pin-anchor.pin-dir-tl .pin-line-diag { transform: rotate(-135deg); }
.pin-anchor.pin-dir-tl .pin-line-h { top: auto; bottom: 40px; left: auto; right: 40px; }
.pin-anchor.pin-dir-tl .pin-info { top: auto; bottom: 40px; left: auto; right: 130px; text-align: right; }

@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-15px); }
    100% { transform: translateY(0px); }
}

/* --- ABOUT SECTION --- */
.about {
    padding: 120px 0;
}

.about .container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
}

.about-visual {
    max-width: 500px;
    margin-left: auto;
}

.about-content .blue-logo {
    height: 160px;
    margin-bottom: 30px;
}

.about-content .heading-rule {
    width: 70px;
    height: 3px;
    background-color: var(--primary-color);
    border: none;
    margin: 24px 0;
}
.about-content .small-title {
    font-size: 14px;
    color: var(--text-light);
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.about-content h2 {
    font-family: 'Mont', sans-serif;
    font-size: 44px;
    color: var(--secondary-color);
    margin-bottom: 30px;
    font-weight: 600; /* Semibold */
    line-height: 1.1;
    letter-spacing: -0.01em;
}

.about-content p {
    font-size: 16px;
    color: var(--text-light);
}

.about-image-wrapper {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}

.about-image-wrapper img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.7s ease, opacity 0.3s ease;
}

.about-image-wrapper:hover img {
    transform: scale(1.05);
}

.about-tabs {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
    position: relative;
}

#about-tabs-line {
    position: absolute;
    bottom: -1px;
    left: 0;
    height: 2px;
    background-color: var(--primary-color);
    transition: all 0.3s ease;
    width: 0; /* JS will set the initial width */
}

.about-tabs span {
    font-size: 13px;
    font-family: var(--font-heading);
    color: var(--text-light);
    cursor: pointer;
    position: relative;
    transition: var(--transition);
}

.about-tabs span.active {
    color: var(--primary-color);
    font-weight: 600;
}
.about-tabs span.active::after {
    content: '';
    position: absolute;
    bottom: -11px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--primary-color);
}

/* --- PARTNERS MARQUEE --- */
.partners {
    padding: 40px 0;
    background: #f9f9f9;
    overflow: hidden;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.marquee {
    display: flex;
    white-space: nowrap;
    overflow: hidden;
    width: 100%;
}

.marquee:hover .marquee-content {
    animation-play-state: paused;
}

.marquee-content {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    animation: marquee-scroll 22s linear infinite;
    will-change: transform;
}

@keyframes marquee-scroll {
    from { transform: translateX(0); }
    to { transform: translateX(-100%); }
}

.marquee-content img.partner-logo,
.marquee-content h3 {
    height: 44px;
    display: flex;
    align-items: center;
    margin: 0 40px;
}

.marquee-content img.partner-logo {
    width: auto;
    max-width: 170px;
    object-fit: contain;
}

.partner-logo-blue {
    filter: invert(30%) sepia(91%) saturate(1510%) hue-rotate(185deg) brightness(85%) contrast(100%);
}

.marquee-content h3 {
    font-family: var(--font-pilat);
    font-size: 26px;
    font-weight: 500;
    color: transparent;
    -webkit-text-stroke: 0.6px rgba(0,0,0,0.35);
    line-height: 44px;
    text-transform: uppercase;
    white-space: nowrap;
    transition: color 0.3s ease, -webkit-text-stroke 0.3s ease;
}

.marquee-content h3:hover {
    color: var(--primary-color);
    -webkit-text-stroke: 0.6px var(--primary-color);
}

/* --- SERVICES INTERACTIVE --- */
.services {
    padding: 120px 0;
    background-color: var(--white);
}

.services-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: flex-start;
}

.services-sticky-image {
    position: sticky;
    top: max(150px, calc(12.5vh + 50px));
    height: 75vh;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0,0,0,0.1);
}

.services-sticky-image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transform: scale(1.05);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.services-sticky-image img.active {
    opacity: 1;
    transform: scale(1);
}

.services-list {
    padding-bottom: 50px;
}

.service-category {
    margin-bottom: 60px;
}

.service-category-title {
    font-family: var(--font-pilat);
    font-size: 11px;
    font-weight: 700;
    color: var(--primary-color);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.service-category-title::before {
    content: '';
    display: block;
    width: 30px;
    height: 2px;
    background-color: var(--primary-color);
}

.service-item {
    font-family: var(--font-heading);
    font-size: 42px;
    font-weight: 700;
    color: #e0e0e0;
    padding: 25px 0;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.service-item::after {
    content: '→';
    font-size: 35px;
    opacity: 0;
    transform: translateX(-20px);
    transition: all 0.4s ease;
}

.service-item:hover, .service-item.active {
    color: var(--primary-color);
    padding-left: 20px;
    border-bottom-color: var(--primary-color);
}

.service-item:hover::after, .service-item.active::after {
    opacity: 1;
    transform: translateX(0);
}

/* --- GLOBAL IMPACT --- */
.global-impact {
    background-color: var(--primary-color);
    padding: 100px 0;
    color: var(--white);
    position: relative;
    overflow: hidden;
}

.impact-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px;
    text-align: center;
}

.impact-item {
    position: relative;
    z-index: 2;
}

.impact-number {
    font-family: var(--font-pilat);
    font-size: 72px;
    font-weight: 700;
    display: inline-block;
    color: var(--white);
    line-height: 1;
}

.impact-plus {
    font-family: var(--font-heading);
    font-size: 50px;
    font-weight: 700;
    color: var(--white);
    vertical-align: top;
}

.impact-label {
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-top: 15px;
    opacity: 0.8;
}

/* --- GLOBAL PRESENCE MAP --- */
.global-map-section {
    padding: 100px 0 50px;
    background-color: #fff;
}

/* jsvectormap'in kendi stil sayfası bu bloktan SONRA (footer'da) yüklendiği
   için, aynı özellik üzerinde eşit özgüllükte bir kural varsa kaynak sırası
   gereği kütüphaneninki kazanıp haritayı ezip küçültüyordu (~165px). Burada
   hem özgüllüğü artırıp hem !important ekleyerek bunu kalıcı olarak önlüyoruz. */
.global-map-section .world-map {
    width: 100% !important;
    height: 340px !important;
    max-width: 680px;
    margin: 0 auto;
}

.world-map .jvm-tooltip {
    background-color: var(--primary-color);
    font-family: var(--font-body);
    font-size: 13px;
    padding: 8px 14px;
    border-radius: 6px;
}

@media (max-width: 768px) {
    /* Dar ekranda harita genişliğe göre otomatik ölçekleniyor (yaklaşık 2:1
       en-boy oranı) — kutuyu masaüstündeki gibi yüksek tutmak haritayı
       büyütmez, sadece üstte/altta boşluk bırakır. Konteyneri haritanın asıl
       oranına yakın tutmak, aynı genişlikte olabilecek en büyük görünümü verir. */
    .global-map-section .world-map { height: 46vw !important; min-height: 160px; max-width: 92%; }
}

/* --- FEATURED PROJECTS (Row List Style) --- */
.featured-projects {
    padding: 60px 0 80px;
    background-color: #fff;
}

.section-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 0;
    padding-bottom: 40px;
    border-bottom: 1px solid #e0e0e0;
}

.section-header h2 {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    margin: 0;
    color: #999;
}

.view-all {
    font-family: var(--font-heading);
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color);
    text-transform: uppercase;
    letter-spacing: 1px;
    position: relative;
}

.view-all::after {
    content: '';
    position: absolute;
    bottom: -3px;
    left: 0;
    width: 0%;
    height: 1px;
    background: var(--primary-color);
    transition: width 0.3s ease;
}

.view-all:hover::after { width: 100%; }

/* Featured Projects — modern bento image grid */
.featured-grid {
    position: relative;
    max-width: 1400px;
    margin: 50px auto 0;
    padding: 0 40px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 260px;
    gap: 22px;
}

.feat-card {
    position: relative;
    display: block;
    grid-column: span 1;
    grid-row: span 1;
    border-radius: 14px;
    overflow: hidden;
    text-decoration: none;
    color: #fff;
    background-color: var(--primary-color);
    box-shadow: 0 10px 30px rgba(13, 24, 35, 0.08);
}

.feat-card.large {
    grid-column: span 2;
    grid-row: span 2;
}

.feat-card-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transition: transform 0.7s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.feat-card:hover .feat-card-img {
    transform: scale(1.08);
}

.feat-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(13,24,35,0) 35%, rgba(13,24,35,0.9) 100%);
    z-index: 1;
}

.feat-card-tag {
    position: absolute;
    top: 18px;
    left: 18px;
    z-index: 2;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #fff;
    background: rgba(255,255,255,0.18);
    backdrop-filter: blur(6px);
    padding: 6px 12px;
    border-radius: 20px;
}

.feat-card-info {
    position: absolute;
    left: 22px;
    right: 22px;
    bottom: 20px;
    z-index: 2;
}

.feat-card-title {
    font-family: var(--font-pilat);
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 4px;
    font-size: 19px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.feat-card.large .feat-card-title { font-size: 30px; }

.feat-card-loc {
    font-size: 13px;
    opacity: 0.85;
    font-weight: 300;
}

.feat-card-arrow {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(255,255,255,0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.35s ease, background 0.35s ease;
}

.feat-card:hover .feat-card-arrow {
    background: var(--primary-color);
    transform: rotate(-45deg);
}

/* --- ENGINEERING (Dark Editorial Panel) --- */
.engineering {
    background-color: var(--primary-color);
    color: var(--white);
    overflow: hidden;
}

.eng-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 80vh;
}

.eng-text-side {
    padding: 100px 80px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.eng-eyebrow {
    font-family: var(--font-heading);
    font-size: 12px;
    letter-spacing: 4px;
    color: rgba(255,255,255,0.85);
    text-transform: uppercase;
    margin-bottom: 40px;
}

.eng-title {
    font-family: var(--font-pilat);
    font-size: 48px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--white);
    margin-bottom: 40px;
    letter-spacing: -0.01em;
}

.eng-desc {
    font-size: 16px;
    line-height: 1.8;
    color: rgba(255,255,255,0.6);
    margin-bottom: 60px;
    max-width: 420px;
}

.eng-features {
    list-style: none;
    padding: 0;
    border-top: 1px solid rgba(255,255,255,0.1);
}

.eng-features li {
    display: flex;
    align-items: baseline;
    gap: 20px;
    padding: 22px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    font-size: 15px;
    color: rgba(255,255,255,0.8);
    font-family: var(--font-heading);
    transition: color 0.3s ease;
}

.eng-features li:hover { color: var(--white); }

.eng-feat-num {
    font-size: 11px;
    color: rgba(255,255,255,0.85);
    letter-spacing: 1px;
    flex-shrink: 0;
    width: 25px;
}

.eng-image-side {
    position: relative;
    overflow: hidden;
}

.eng-image-side img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.7) saturate(0.7);
    transition: transform 0.8s ease;
}

.engineering:hover .eng-image-side img {
    transform: scale(1.03);
}

/* --- JOURNAL / NEWS --- */
.journal {
    padding: 120px 0;
    background-color: var(--white);
}

.journal-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 60px;
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
}

.journal-title {
    font-family: var(--font-pilat);
    font-size: 32px;
    font-weight: 700;
    color: var(--secondary-color);
}

.journal-link-all {
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--primary-color);
    display: flex;
    align-items: center;
    gap: 8px;
    transition: transform 0.3s ease;
}
.journal-link-all:hover {
    transform: translateX(5px);
}

.journal-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.journal-card {
    display: block;
    color: var(--secondary-color);
    text-decoration: none;
    group: hover;
}

.journal-img-wrapper {
    width: 100%;
    height: 250px;
    overflow: hidden;
    margin-bottom: 20px;
}

.journal-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.journal-card:hover .journal-img-wrapper img {
    transform: scale(1.05);
}

.journal-date {
    display: block;
    font-size: 11px;
    color: #888;
    letter-spacing: 2px;
    margin-bottom: 10px;
}

.journal-heading {
    font-family: var(--font-pilat);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    transition: color 0.3s ease;
}

.journal-card:hover .journal-heading {
    color: var(--primary-color);
}

/* --- FOOTER (Premium Editorial) --- */
.footer {
    background-color: var(--primary-color);
    color: var(--white);
}

/* CTA Strip */
.footer-cta {
    border-bottom: 1px solid rgba(255,255,255,0.08);
    padding: 90px 0;
}

.footer-cta-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 5%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 60px;
}

.footer-cta-title {
    font-family: var(--font-pilat);
    font-size: 52px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--white);
    margin-bottom: 16px;
}

.footer-cta-title em {
    font-style: normal;
    color: var(--white);
    text-decoration: underline;
    text-decoration-color: rgba(255,255,255,0.4);
    text-underline-offset: 6px;
}

.footer-cta-sub {
    font-size: 16px;
    color: rgba(255,255,255,0.5);
    max-width: 380px;
}

.footer-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    padding: 22px 48px;
    border: 1.5px solid rgba(255,255,255,0.25);
    border-radius: 60px;
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 1px;
    color: var(--white);
    text-transform: uppercase;
    white-space: nowrap;
    transition: all 0.4s ease;
    flex-shrink: 0;
}

.footer-cta-btn span {
    transition: transform 0.3s ease;
}

.footer-cta-btn:hover {
    background: var(--white);
    border-color: var(--white);
    color: var(--primary-color);
}

.footer-cta-btn:hover span {
    transform: translateX(6px);
}

/* Main Grid */
.footer-main {
    padding: 80px 0 60px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.4fr;
    gap: 60px;
}

/* Brand Column */
.footer-brand img {
    display: block;
    height: 42px;
    width: auto;
    max-width: 160px;
    object-fit: contain;
    filter: brightness(0) invert(1);
    margin-bottom: 22px;
}

.footer-brand p {
    font-size: 14px;
    color: rgba(255,255,255,0.45);
    line-height: 1.8;
    max-width: 270px;
    margin-bottom: 30px;
}

.footer-social {
    display: flex;
    gap: 12px;
}

.social-link {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,0.5);
    transition: all 0.3s ease;
}

.social-link:hover {
    border-color: var(--white);
    color: var(--white);
    background: rgba(255,255,255,0.12);
}

/* Nav Columns */
.footer-col-title {
    font-family: var(--font-heading);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.35);
    margin-bottom: 28px;
}

.footer-nav {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.footer-nav a {
    font-size: 14px;
    color: rgba(255,255,255,0.65);
    padding: 9px 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    transition: color 0.25s ease, padding-left 0.25s ease;
    position: relative;
}

.footer-nav a:last-child {
    border-bottom: none;
}

.footer-nav a:hover {
    color: var(--white);
    padding-left: 8px;
}

/* Contact column */
.footer-contact-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.footer-contact-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.footer-contact-label {
    font-size: 10px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.3);
}

.footer-contact-val {
    font-size: 14px;
    color: rgba(255,255,255,0.75);
}

/* İletişim sayfası bu footer sınıfını beyaz olmayan (açık) bir bölümde
   tekrar kullanıyor — beyaz metin beyaz zeminde görünmez oluyordu. */
.hr-info .footer-contact-val {
    color: var(--text-color);
    font-weight: 500;
}

/* Bottom Bar */
.footer-bottom {
    padding: 22px 0;
}

.footer-bottom-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-copy {
    font-size: 12px;
    color: rgba(255,255,255,0.25);
    letter-spacing: 0.5px;
}

.footer-bottom-links {
    display: flex;
    gap: 16px;
    align-items: center;
    font-size: 12px;
    color: rgba(255,255,255,0.25);
}

.footer-bottom-links a {
    color: rgba(255,255,255,0.35);
    transition: color 0.2s ease;
}

.footer-bottom-links a:hover {
    color: var(--white);
}

/* Credits Strip (footer'in altinda, ajans imzasi) */
.credits-strip {
    background-color: #081019;
    border-top: 1px solid rgba(255,255,255,0.06);
    padding: 14px 0;
}

.credits-strip-inner {
    display: flex;
    justify-content: center;
}

.credits-link {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: rgba(255,255,255,0.3);
    font-size: 12px;
    letter-spacing: 0.3px;
    transition: color 0.2s ease, opacity 0.2s ease;
    opacity: 0.7;
}

.credits-link:hover {
    color: rgba(255,255,255,0.6);
    opacity: 1;
}

.credits-logo {
    height: 14px;
    width: auto;
    object-fit: contain;
}

/* ====================================================
   SUBPAGES: COMPACT HEADER (HERO + MANIFESTO)
   ==================================================== */

.compact-header {
    position: relative;
    background-color: var(--primary-color);
    /* Subtle Engineering Grid Texture */
    background-image: 
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 40px 40px;
    color: var(--white);
    padding: 180px 0 80px 0; /* Top padding offsets the fixed header */
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.compact-header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 60px;
}

.ch-left {
    flex: 0 0 35%;
}

.ch-title {
    font-family: var(--font-pilat);
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 15px;
    line-height: 1.1;
}

.breadcrumbs {
    font-size: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: rgba(255,255,255,0.5);
}
.breadcrumbs a { color: var(--white); text-decoration: none; }
.breadcrumbs a:hover { color: rgba(255,255,255,0.7); }
.breadcrumbs .sep { margin: 0 10px; color: rgba(255,255,255,0.3); }

.ch-right {
    flex: 0 0 60%;
    padding-left: 40px;
    border-left: 1px solid rgba(255,255,255,0.15);
}

.manifesto-eyebrow {
    font-size: 11px;
    letter-spacing: 3px;
    color: rgba(255,255,255,0.85);
    text-transform: uppercase;
    margin-bottom: 15px;
}

.manifesto-text {
    font-family: 'Mont', sans-serif;
    font-weight: 600;
    font-size: 22px;
    line-height: 1.6;
    color: rgba(255,255,255,0.9);
    margin: 0;
}

.compact-header-container.solo .ch-left {
    flex: 0 0 100%;
}

/* ====================================================
   SUBPAGE: ABOUT US (HAKKIMIZDA)
   ==================================================== */

.about-split-section {
    padding: 120px 0;
    background-color: var(--white);
}

.about-split-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}

.about-heading {
    font-family: var(--font-pilat);
    font-size: 36px;
    font-weight: 700;
    color: var(--secondary-color);
    margin-bottom: 30px;
    line-height: 1.2;
}

.about-text {
    font-size: 16px;
    color: rgba(13,24,35,0.7);
    line-height: 1.8;
    margin-bottom: 25px;
}

.about-stats {
    display: flex;
    gap: 40px;
    margin-top: 50px;
    padding-top: 40px;
    border-top: 1px solid rgba(13,24,35,0.1);
}

.about-content {
    /* Grid items default to min-width:auto — without this, the no-wrap
       .about-stats row below forces this whole column (and its heading)
       wider than the grid track, overflowing the viewport on mobile. */
    min-width: 0;
}

.stat-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.stat-number {
    font-family: var(--font-pilat);
    font-size: 42px;
    font-weight: 700;
    color: var(--primary-color);
}

.stat-label {
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--secondary-color);
    font-weight: 500;
}

.hk-about-image-wrapper {
    position: relative;
    height: 600px;
    border-radius: 4px;
    overflow: hidden;
}

.hk-about-image {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}

.about-image-badge {
    position: absolute;
    bottom: -20px;
    left: -20px;
    background-color: var(--primary-color);
    width: 150px;
    height: 150px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--white);
    font-family: var(--font-pilat);
    font-size: 16px;
    font-weight: 700;
    transform: rotate(-15deg);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* ====================================================
   SUBPAGE: HISTORY (TARİHÇE)
   ==================================================== */

.timeline-section {
    padding: 120px 0;
    background-color: var(--white);
    position: relative;
}

.timeline {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
}

/* The vertical line */
.timeline::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 20px;
    width: 2px;
    background-color: rgba(13,24,35,0.1);
}

.timeline-item {
    position: relative;
    padding-left: 80px;
    margin-bottom: 60px;
    opacity: 0;
    transform: translateY(30px);
    animation: fadeUpTimeline 0.8s ease forwards;
}

.timeline-item:last-child {
    margin-bottom: 0;
}

@keyframes fadeUpTimeline {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.timeline-item:nth-child(1) { animation-delay: 0.1s; }
.timeline-item:nth-child(2) { animation-delay: 0.2s; }
.timeline-item:nth-child(3) { animation-delay: 0.3s; }
.timeline-item:nth-child(4) { animation-delay: 0.4s; }
.timeline-item:nth-child(5) { animation-delay: 0.5s; }

.timeline-dot {
    position: absolute;
    left: 11px;
    top: 5px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: var(--primary-color);
    border: 4px solid var(--white);
    box-shadow: 0 0 0 2px rgba(13,24,35,0.1);
}

.timeline-content {
    background: #f9f9f9;
    padding: 30px;
    border-radius: 4px;
    border-left: 3px solid var(--primary-color);
}

.timeline-year {
    font-family: var(--font-pilat);
    font-size: 32px;
    font-weight: 700;
    color: var(--secondary-color);
    margin-bottom: 10px;
}

.timeline-title {
    font-family: 'Mont', sans-serif;
    font-weight: 600;
    font-size: 20px;
    color: var(--primary-color);
    margin-bottom: 15px;
}

.timeline-text {
    font-size: 15px;
    color: rgba(13,24,35,0.7);
    line-height: 1.6;
}

/* ====================================================
   SUBPAGE: NEWS (BİZDEN HABERLER)
   ==================================================== */

.news-section {
    padding: 120px 0;
    background-color: #f9f9f9;
}

.news-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.news-card {
    background: var(--white);
    display: flex;
    flex-direction: column;
    text-decoration: none;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.news-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}

.news-card.featured {
    grid-column: 1 / -1;
    flex-direction: row;
    min-height: 400px;
}

.news-img {
    height: 300px;
    background-size: cover;
    background-position: center;
    transition: transform 0.6s ease;
}

.news-card.featured .news-img {
    flex: 0 0 60%;
    height: auto;
}

.news-card:hover .news-img {
    transform: scale(1.05);
}

.news-content {
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: var(--white);
    position: relative;
    z-index: 2;
}

.news-card.featured .news-content {
    flex: 1;
}

.news-date {
    font-size: 13px;
    color: var(--primary-color);
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 15px;
    font-weight: 500;
}

.news-title {
    font-family: var(--font-pilat);
    font-size: 24px;
    font-weight: 700;
    color: var(--secondary-color);
    margin-bottom: 20px;
    line-height: 1.3;
}

.news-card.featured .news-title {
    font-size: 32px;
}

.news-excerpt {
    font-size: 15px;
    color: rgba(13,24,35,0.7);
    line-height: 1.6;
    margin-bottom: 30px;
}

.news-readmore {
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 14px;
    color: var(--secondary-color);
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: color 0.3s ease;
}

.news-card:hover .news-readmore {
    color: var(--primary-color);
}

/* ====================================================
   SUBPAGE: CERTIFICATES (SERTİFİKALAR)
   ==================================================== */

.certs-section {
    padding: 120px 0;
    background-color: var(--white);
}

.certs-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.cert-card {
    background: #f9f9f9;
    border: 1px solid rgba(13,24,35,0.05);
    border-radius: 4px;
    padding: 30px;
    text-align: center;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    cursor: pointer;
}

.cert-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0,0,0,0.08);
    background: var(--white);
}

.cert-img-wrapper {
    height: 250px;
    margin-bottom: 25px;
    background: var(--white);
    border: 1px dashed rgba(13,24,35,0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: border-color 0.3s ease;
}

.cert-card:hover .cert-img-wrapper {
    border-color: var(--primary-color);
}

.cert-placeholder {
    font-family: var(--font-pilat);
    font-size: 24px;
    color: rgba(13,24,35,0.2);
    font-weight: 700;
}

.cert-title {
    font-family: 'Mont', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: var(--secondary-color);
    margin-bottom: 10px;
}

.cert-desc {
    font-size: 14px;
    color: rgba(13,24,35,0.6);
    line-height: 1.5;
}

/* ====================================================
   SUBPAGE: REFERENCES (REFERANSLARIMIZ)
   ==================================================== */

/* Projelerimiz: Büyük Animasyonlu Proje Hero'su (anasayfa hero'suyla aynı slider motoru) */
/* Every hero slide needs a scrim behind its text, not just the projects
   hero — the homepage slider had none, so white text sat directly on
   whatever part of the photo happened to be there (signage, bright sky),
   making it unreadable whenever the image wasn't dark under the text. */
.hero-slide::before {
    content: '';
    position: absolute;
    inset: 0;
    /* Dark region reaches a bit further right than the classic hero-content
       box's 60% width, so a title stretching to the full box width stays
       readable instead of running off the end of the scrim. */
    background: linear-gradient(90deg, rgba(13,24,35,0.85) 0%, rgba(13,24,35,0.5) 64%, rgba(13,24,35,0.15) 100%);
    opacity: var(--overlay-strength, 0.7);
    z-index: 1;
}

/* Sararti (sarı ton) katmanı — karartıdan bağımsız, panelden ayrıca
   ayarlanabilen isteğe bağlı bir renk filtresi. Yönsüz/düz uygulanır
   (metin okunabilirliği için değil, genel görsel ton için). */
.hero-slide::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255, 183, 0, 1);
    opacity: var(--tint-strength, 0);
    z-index: 1;
}

/* Home hero — 3 selectable title/description layouts (Panel > Hero/Slider > Metin Tasarımı).
   Each layout also gets its own scrim direction — a left-to-right darkening
   only makes sense for left-anchored text; centered/bottom-anchored text
   needs the dark area to actually sit where that text sits. */
.hero-slide.style-center .container {
    align-items: center;
    justify-content: center;
    padding-top: 0;
    text-align: center;
}

.hero-slide.style-center .hero-content {
    max-width: 720px;
    margin: 0 auto;
}

.hero-slide.style-center .hero-desc {
    margin-left: auto;
    margin-right: auto;
}

.hero-slide.style-center::before {
    background: radial-gradient(ellipse at center, rgba(13,24,35,0.95) 0%, rgba(13,24,35,0.8) 35%, rgba(13,24,35,0.55) 65%, rgba(13,24,35,0.35) 100%);
}

.hero-slide.style-minimal .container {
    align-items: flex-end;
    padding-top: 0;
    padding-bottom: 70px;
}

.hero-slide.style-minimal .hero-title {
    font-size: 40px;
    margin-bottom: 10px;
}

.hero-slide.style-minimal .hero-desc {
    -webkit-line-clamp: 2;
    margin-bottom: 20px;
}

.hero-slide.style-minimal::before {
    background: linear-gradient(180deg, rgba(13,24,35,0) 35%, rgba(13,24,35,0.92) 100%);
}

/* Sağ üst / alt orta / sağ alt — sol taraftaki desenlerin ayna simetriği */
.hero-slide.style-topright .container {
    align-items: flex-start;
    justify-content: flex-end;
    text-align: right;
}

.hero-slide.style-topright .hero-content {
    margin-left: auto;
}

.hero-slide.style-topright .hero-desc {
    margin-left: auto;
    margin-right: 0;
}

.hero-slide.style-topright::before {
    background: linear-gradient(270deg, rgba(13,24,35,0.85) 0%, rgba(13,24,35,0.5) 64%, rgba(13,24,35,0.15) 100%);
}

.hero-slide.style-bottomcenter .container {
    align-items: flex-end;
    justify-content: center;
    padding-top: 0;
    padding-bottom: 70px;
    text-align: center;
}

.hero-slide.style-bottomcenter .hero-content {
    max-width: 720px;
    margin: 0 auto;
}

.hero-slide.style-bottomcenter .hero-title {
    font-size: 40px;
    margin-bottom: 10px;
}

.hero-slide.style-bottomcenter .hero-desc {
    margin-left: auto;
    margin-right: auto;
    -webkit-line-clamp: 2;
    margin-bottom: 20px;
}

.hero-slide.style-bottomcenter::before {
    background: linear-gradient(180deg, rgba(13,24,35,0) 35%, rgba(13,24,35,0.92) 100%);
}

.hero-slide.style-bottomright .container {
    align-items: flex-end;
    justify-content: flex-end;
    padding-top: 0;
    padding-bottom: 70px;
    text-align: right;
}

.hero-slide.style-bottomright .hero-content {
    margin-left: auto;
}

.hero-slide.style-bottomright .hero-title {
    font-size: 40px;
    margin-bottom: 10px;
}

.hero-slide.style-bottomright .hero-desc {
    margin-left: auto;
    margin-right: 0;
    -webkit-line-clamp: 2;
    margin-bottom: 20px;
}

.hero-slide.style-bottomright::before {
    background: linear-gradient(180deg, rgba(13,24,35,0) 35%, rgba(13,24,35,0.92) 100%);
}

.proj-hero .breadcrumbs {
    margin-bottom: 22px;
}

/* Vertical dot navigator for the projects-page featured hero, aligned with
   the breadcrumb's left edge (same inset as .container, including its
   max-width-1440px centering) instead of hugging the raw viewport edge.
   Each dot carries its own project's name/location, revealed only next to
   the currently active dot (no JS changes needed — it just follows the
   existing .active class that the slider already toggles per dot). */
.proj-hero .hero-progress {
    left: max(5vw, calc((100vw - 1440px) / 2 + 5vw));
    right: auto;
    bottom: auto;
    top: 66%;
    transform: translateY(-50%);
    flex-direction: column;
    align-items: center;
    gap: 30px;
    padding: 0;
}

.proj-hero .hero-progress-bar {
    flex: 0 0 auto;
    width: 1.5px;
    height: 1.5px;
    border-radius: 50%;
    border: 0.75px solid rgba(255, 255, 255, 0.5);
    background: transparent;
    background-clip: content-box;
    /* Extra invisible padding enlarges the click target well beyond the
       visible dot, without changing how big the dot looks. */
    padding: 9px;
    box-sizing: content-box;
    margin: -9px;
    transition: border-color 0.25s ease, background-color 0.25s ease;
}

.proj-hero .hero-progress-track,
.proj-hero .hero-progress-fill {
    display: none;
}

.proj-hero .hero-progress-bar.active {
    width: 2px;
    height: 2px;
    background: var(--white);
    border-color: var(--white);
}

.proj-hero .hero-progress-bar.done {
    background: rgba(255, 255, 255, 0.55);
    border-color: rgba(255, 255, 255, 0.55);
}

.proj-hero .hero-title {
    font-size: 48px;
}

.proj-hero-mobile-caption {
    display: none;
}

.proj-hero-navtext {
    position: absolute;
    left: 40px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 4;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    gap: 10px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.proj-hero .hero-progress-bar.active .proj-hero-navtext {
    opacity: 1;
    pointer-events: auto;
}

.proj-hero-navtext-name {
    font-family: var(--font-pilat);
    font-weight: 700;
    font-size: 18px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--white);
}

.proj-hero-navtext-sep {
    color: rgba(255, 255, 255, 0.4);
    font-size: 15px;
}

.proj-hero-navtext-loc {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.7);
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

/* Scroll-reveal utility */
.reveal-up {
    opacity: 0;
    transform: translateY(34px);
    transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}

.reveal-up.in-view {
    opacity: 1;
    transform: translateY(0);
}

.refs-search-wrap {
    position: relative;
    max-width: 340px;
    margin: 0 auto 32px;
}

.refs-search-icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-light);
    pointer-events: none;
}

.refs-search-input {
    width: 100%;
    padding: 11px 14px 11px 40px;
    font-size: 14px;
    font-family: inherit;
    color: var(--text-color);
    background-color: #f9f9f9;
    border: 1px solid rgba(13,24,35,0.1);
    border-radius: 30px;
    outline: none;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.refs-search-input:focus {
    border-color: var(--primary-color);
    background-color: var(--white);
}

.refs-search-input::placeholder {
    color: var(--text-light);
}

.refs-filter-group {
    margin-bottom: 26px;
}

.refs-filter-label {
    text-align: center;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 14px;
}

.refs-section {
    padding: 120px 0;
    background-color: var(--white);
}

.refs-filters {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 60px;
}

.filter-btn {
    background: transparent;
    border: 1px solid rgba(13,24,35,0.2);
    padding: 10px 25px;
    border-radius: 30px;
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 14px;
    color: var(--secondary-color);
    cursor: pointer;
    transition: all 0.3s ease;
}

.filter-btn:hover,
.filter-btn.active {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: var(--white);
}

.refs-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.ref-card {
    position: relative;
    height: 350px;
    overflow: hidden;
    border-radius: 4px;
    text-decoration: none;
    display: block;
}

.ref-img {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

.ref-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to top, rgba(13,24,35,0.95) 0%, rgba(13,24,35,0.2) 60%, transparent 100%);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 30px;
    opacity: 1; /* Always show gradient for legibility */
    transition: background 0.4s ease;
}

.ref-category {
    font-size: 11px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--primary-color);
    margin-bottom: 10px;
    transform: translateY(20px);
    opacity: 0;
    transition: all 0.4s ease;
}

.ref-title {
    font-family: var(--font-pilat);
    font-size: 22px;
    font-weight: 700;
    color: var(--white);
    margin-bottom: 0;
    transition: transform 0.4s ease;
}

.ref-view {
    font-size: 14px;
    color: var(--white);
    margin-top: 15px;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.4s ease;
    transition-delay: 0.1s;
}

.ref-card:hover .ref-img {
    transform: scale(1.1);
}

.ref-card:hover .ref-overlay {
    background: rgba(13,24,35,0.7);
}

.ref-card:hover .ref-category,
.ref-card:hover .ref-view {
    opacity: 1;
    transform: translateY(0);
}

.ref-card:hover .ref-title {
    transform: translateY(-5px);
}

.ref-badge {
    position: absolute;
    top: 30px;
    left: 22px;
    z-index: 2;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--white);
    background: var(--primary-color);
    padding: 5px 12px;
    border-radius: 30px;
}

.refs-grid.cols-4 {
    grid-template-columns: repeat(5, 1fr);
    grid-auto-rows: 230px;
    gap: 18px;
}

.refs-grid.cols-4 .ref-card {
    height: 100%;
}

.refs-grid.cols-4 .ref-overlay {
    padding: 16px;
}

.refs-grid.cols-4 .ref-badge {
    top: 14px;
    left: 14px;
}

.refs-grid.cols-4 .ref-title {
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.refs-grid.cols-4 .ref-card.ref-big {
    grid-column: span 2;
    grid-row: span 2;
}

.refs-grid.cols-4 .ref-card.ref-big .ref-overlay {
    padding: 30px;
}

.refs-grid.cols-4 .ref-card.ref-big .ref-badge {
    top: 30px;
    left: 22px;
}

.refs-grid.cols-4 .ref-card.ref-big .ref-title {
    font-size: 28px;
    -webkit-line-clamp: 3;
}

/* Yukarı Çık Butonu (Buzlu Cam) */
.scroll-top-btn {
    position: fixed;
    right: 30px;
    bottom: 30px;
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: rgba(13, 24, 35, 0.35);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.28);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--white);
    opacity: 0;
    visibility: hidden;
    transform: translateY(14px);
    transition: opacity 0.3s ease, transform 0.3s ease, background 0.3s ease;
    z-index: 500;
}

.scroll-top-btn.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.scroll-top-btn:hover {
    background: rgba(13, 24, 35, 0.55);
    border-color: rgba(255, 255, 255, 0.4);
}

.scroll-top-btn svg {
    width: 22px;
    height: 22px;
}

@media (max-width: 640px) {
    .scroll-top-btn {
        right: 16px;
        bottom: 16px;
        width: 44px;
        height: 44px;
        border-radius: 14px;
    }
    .scroll-top-btn svg {
        width: 18px;
        height: 18px;
    }
}

/* Proje Fotoğraf Galerisi (Lightbox) */
.proj-lightbox {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: rgba(13, 24, 35, 0.94);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
}

.proj-lightbox.open {
    opacity: 1;
    visibility: visible;
}

.lightbox-stage {
    position: relative;
    max-width: 86vw;
    max-height: 86vh;
    text-align: center;
}

.lightbox-stage img {
    max-width: 86vw;
    max-height: 74vh;
    object-fit: contain;
    border-radius: 4px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
}

.lightbox-caption {
    color: var(--white);
    margin: 18px 0 4px;
    font-family: var(--font-pilat);
    font-size: 18px;
}

.lightbox-counter {
    display: block;
    color: rgba(255, 255, 255, 0.55);
    font-size: 13px;
    letter-spacing: 1px;
}

.lightbox-close {
    position: absolute;
    top: 24px;
    right: 30px;
    background: none;
    border: none;
    color: var(--white);
    font-size: 36px;
    line-height: 1;
    cursor: pointer;
    z-index: 2;
}

.lightbox-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.08);
    color: var(--white);
    font-size: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    z-index: 2;
}

.lightbox-nav:hover {
    background: var(--primary-color);
    border-color: var(--primary-color);
}

.lightbox-nav.prev { left: 30px; }
.lightbox-nav.next { right: 30px; }

.proj-lightbox.single-image .lightbox-nav {
    display: none;
}

@media (max-width: 640px) {
    .lightbox-nav { width: 42px; height: 42px; font-size: 16px; }
    .lightbox-nav.prev { left: 10px; }
    .lightbox-nav.next { right: 10px; }
    .lightbox-close { top: 14px; right: 16px; font-size: 28px; }
    .lightbox-caption { font-size: 15px; }
}

/* ====================================================
   SUBPAGE: HR (İNSAN KAYNAKLARI)
   ==================================================== */

.hr-section {
    padding: 120px 0;
    background-color: #f9f9f9;
}

.hr-split-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: flex-start;
}

.hr-heading {
    font-family: var(--font-pilat);
    font-size: 32px;
    font-weight: 700;
    color: var(--secondary-color);
    margin-bottom: 25px;
    line-height: 1.3;
}

.hr-text {
    font-size: 16px;
    color: rgba(13,24,35,0.7);
    line-height: 1.8;
    margin-bottom: 20px;
}

.hr-features {
    margin-top: 40px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.hr-feature {
    display: flex;
    align-items: center;
    gap: 15px;
}

.hr-feature-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background-color: var(--primary-color);
    color: var(--white);
    border-radius: 50%;
    font-size: 12px;
    font-weight: bold;
}

.hr-feature-text {
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 16px;
    color: var(--secondary-color);
}

.hr-form-wrapper {
    background: var(--white);
    padding: 50px;
    border-radius: 4px;
    box-shadow: 0 15px 40px rgba(0,0,0,0.05);
}

.form-title {
    font-family: var(--font-pilat);
    font-size: 24px;
    font-weight: 700;
    color: var(--secondary-color);
    margin-bottom: 30px;
}

.form-group {
    margin-bottom: 20px;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.form-control {
    width: 100%;
    padding: 15px 20px;
    background: #f5f7fa;
    border: 1px solid transparent;
    border-radius: 4px;
    font-family: 'Outfit', sans-serif;
    font-size: 15px;
    color: var(--secondary-color);
    transition: all 0.3s ease;
}

.form-control:focus {
    outline: none;
    background: var(--white);
    border-color: var(--primary-color);
}

.file-upload-group {
    position: relative;
}

.file-upload-input {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    opacity: 0;
    cursor: pointer;
}

.file-upload-label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: #f5f7fa;
    border: 1px dashed rgba(13,24,35,0.2);
    border-radius: 4px;
    font-family: 'Outfit', sans-serif;
    font-size: 15px;
    color: rgba(13,24,35,0.6);
}

.file-upload-btn {
    background: var(--primary-color);
    color: var(--white);
    padding: 5px 15px;
    border-radius: 3px;
    font-size: 13px;
    font-weight: 500;
}

.hr-submit-btn {
    width: 100%;
    padding: 18px;
    background: var(--primary-color);
    color: var(--white);
    border: none;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.hr-submit-btn:hover {
    background: #004d80;
}

.form-note {
    font-size: 12px;
    color: rgba(13,24,35,0.5);
    text-align: center;
    margin-top: 15px;
}

/* ====================================================
   SUBPAGE: KVKK (KİŞİSEL VERİLERİN KORUNMASI)
   ==================================================== */

.kvkk-section {
    padding: 120px 0;
    background-color: var(--white);
}

.kvkk-list {
    max-width: 900px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.kvkk-doc-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 40px 30px;
    background: #f9f9f9;
    border: 1px solid rgba(13,24,35,0.05);
    border-radius: 8px;
    transition: all 0.3s ease;
}

.kvkk-doc-item:hover {
    transform: translateY(-6px);
    background: var(--white);
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
    border-color: rgba(13,24,35,0.1);
}

.doc-icon {
    width: 60px;
    height: 60px;
    background: var(--primary-color);
    color: var(--white);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    flex-shrink: 0;
}

.doc-info {
    margin-bottom: 22px;
}

.doc-title {
    font-family: 'Mont', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: var(--secondary-color);
    margin-bottom: 8px;
}

.doc-meta {
    font-size: 13px;
    color: rgba(13,24,35,0.5);
}

.doc-download-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 25px;
    background: transparent;
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 14px;
    border-radius: 4px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

/* --- Language Dropdown --- */
.lang-dropdown-wrapper {
    position: relative;
    display: inline-block;
}

.lang-switch {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: var(--white);
    padding: 8px 15px;
    border-radius: 4px;
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 13px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
}

.lang-switch:hover,
.lang-dropdown-wrapper:hover .lang-switch {
    border-color: var(--white);
    background: rgba(255, 255, 255, 0.1);
}

.lang-dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    background: var(--white);
    min-width: 100px;
    border-radius: 4px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    list-style: none;
    padding: 10px 0;
    margin: 10px 0 0 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.3s ease;
    z-index: 100;
}

.lang-dropdown-wrapper:hover .lang-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.lang-dropdown li a {
    display: block;
    padding: 8px 20px;
    color: var(--secondary-color);
    text-decoration: none;
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 500;
    transition: background 0.2s ease, color 0.2s ease;
}

.lang-dropdown li a:hover,
.lang-dropdown li a.active {
    background: rgba(0, 87, 184, 0.05);
    color: var(--primary-color);
}
/* --- End Language Dropdown --- */

.doc-download-btn:hover {
    background: var(--primary-color);
    color: var(--white);
}

.doc-actions {
    display: flex;
    gap: 10px;
}

.doc-download-btn.icon-only {
    padding: 12px;
}

/* Terms & Conditions (KVKK page) */
.terms-section {
    padding: 60px 0 100px;
    background-color: var(--white);
}

.terms-heading {
    margin-bottom: 30px;
}

.terms-eyebrow {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--primary-color);
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.terms-heading h2 {
    font-family: 'Mont', sans-serif;
    font-size: 32px;
    font-weight: 600;
    color: var(--secondary-color);
    margin: 0;
}

.terms-heading-rule {
    width: 60px;
    height: 3px;
    background-color: var(--primary-color);
    border: none;
    margin: 20px 0 0;
}

.terms-content h3 {
    font-family: 'Mont', sans-serif;
    font-size: 19px;
    font-weight: 700;
    color: var(--secondary-color);
    margin: 36px 0 12px;
    padding-left: 16px;
    position: relative;
}

.terms-content h3:first-child {
    margin-top: 0;
}

.terms-content h3::before {
    content: '';
    position: absolute;
    left: 0;
    top: 3px;
    bottom: 3px;
    width: 3px;
    background-color: var(--primary-color);
    border-radius: 2px;
}

.terms-content p {
    color: var(--text-light);
    font-size: 15px;
    line-height: 1.85;
    margin-bottom: 16px;
}

.terms-content strong {
    color: var(--secondary-color);
}

.terms-content ul, .terms-content ol {
    color: var(--text-light);
    font-size: 15px;
    line-height: 1.85;
    padding-left: 20px;
    margin-bottom: 16px;
}

/* Pillar Cards Layout */
.pillar-section {
    background-color: var(--white);
    padding: 0;
    height: 700px;
}

.pillar-container {
    display: flex;
    width: 100%;
    height: 100%;
}

.pillar-card {
    flex: 1;
    position: relative;
    height: 100%;
    overflow: hidden;
    transition: flex 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    cursor: pointer;
    border-right: 1px solid rgba(255,255,255,0.1);
}

.pillar-card:last-child {
    border-right: none;
}

/* Background Image */
.pillar-bg {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background-size: cover;
    background-position: center;
    transition: transform 0.8s ease;
    z-index: 1;
}

/* Dark Overlay */
.pillar-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.3) 50%, rgba(0,0,0,0.1) 100%);
    transition: background 0.6s ease;
    z-index: 2;
}

/* Content Area */
.pillar-content {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 32px 24px;
    z-index: 3;
    color: var(--white);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
}

.pillar-header {
    transition: transform 0.6s ease;
}

.pillar-num {
    font-family: var(--font-heading);
    font-size: 14px;
    color: var(--primary-color);
    letter-spacing: 2px;
    margin-bottom: 10px;
    display: block;
}

.pillar-title {
    font-family: var(--font-pilat);
    font-size: clamp(16px, 1.4vw, 25px);
    line-height: 1.2;
    margin: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    hyphens: auto;
}

/* Hidden Details */
.pillar-details {
    height: 0;
    opacity: 0;
    overflow: hidden;
    transition: all 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    margin-top: 0;
}

.pillar-list {
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
    font-size: 15px;
    line-height: 2.2;
    color: rgba(255,255,255,0.8);
}

.pillar-list.double-col {
    column-count: 2;
    column-gap: 20px;
}

.pillar-link {
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--primary-color);
    text-decoration: none;
}
.pillar-link .arrow {
    margin-left: 10px;
    transition: transform 0.3s ease;
}
.pillar-link:hover .arrow {
    transform: translateX(5px);
}

/* Hover States */
.pillar-card:hover {
    flex: 1; /* Genişlik sabit kalır — başlık her koşulda aynı satırlara sarılır, "garip" reflow olmaz */
}

.pillar-card:hover .pillar-bg {
    transform: scale(1.1); /* Zoom image */
}

.pillar-card:hover .pillar-overlay {
    background: linear-gradient(to top, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.6) 60%, rgba(0,0,0,0.3) 100%);
}

.pillar-card:hover .pillar-header {
    transform: translateY(-20px);
}

.pillar-card:hover .pillar-details {
    height: auto;
    opacity: 1;
    margin-top: 20px;
}

/* --- FAALİYET KATEGORİ SAYFASI (tek sayfa, akıcı akış) --- */
.category-intro {
    padding: 70px 0 50px;
    background: var(--white);
}

.category-intro .container {
    max-width: 880px;
}

.category-intro p {
    font-size: 18px;
    line-height: 1.8;
    color: var(--text-light);
}

.category-body-grid {
    display: grid;
    grid-template-columns: 230px 1fr;
    gap: 70px;
    align-items: start;
    padding-top: 60px;
}

.category-body-grid.no-nav {
    grid-template-columns: 1fr;
}

.category-sidenav {
    position: sticky;
    top: 110px;
}

.category-sidenav-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: #b0b6bd;
    margin-bottom: 18px;
}

.category-sidenav nav {
    display: flex;
    flex-direction: column;
}

.category-sidenav nav a {
    padding: 13px 0 13px 18px;
    color: var(--text-light);
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
    border-left: 2px solid #e7e9ec;
    transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.category-sidenav nav a:hover {
    color: var(--secondary-color);
    border-left-color: #b0b6bd;
}

.category-sidenav nav a.active {
    color: var(--primary-color);
    font-weight: 700;
    border-left-color: var(--primary-color);
    background: linear-gradient(to right, rgba(0,106,179,0.06), transparent 85%);
}

.category-rows {
    min-width: 0;
}

.svc-row {
    display: flex;
    align-items: center;
    gap: 70px;
    padding: 90px 0;
    scroll-margin-top: 90px;
}

.svc-row:not(:last-child) {
    border-bottom: 1px solid #f0f0f0;
}

.svc-row.reverse {
    flex-direction: row-reverse;
}

.svc-row-media-wrap {
    flex: 0 0 45%;
    min-width: 0;
}

.svc-row-media {
    height: 440px;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 30px 60px rgba(0,0,0,0.12);
}

.svc-row-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.35s ease;
}

.svc-row-thumbs {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}

.svc-thumb {
    flex: 1;
    max-width: 90px;
    height: 64px;
    border-radius: 8px;
    background-size: cover;
    background-position: center;
    cursor: pointer;
    opacity: 0.55;
    border: 2px solid transparent;
    transition: opacity 0.2s ease, border-color 0.2s ease;
}

.svc-thumb:hover {
    opacity: 0.85;
}

.svc-thumb.active {
    opacity: 1;
    border-color: var(--primary-color);
}

.svc-row-content {
    flex: 1;
    min-width: 0;
}

.svc-row-eyebrow {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--primary-color);
    margin-bottom: 14px;
}

.svc-row-title {
    font-family: var(--font-pilat);
    font-size: 34px;
    color: var(--secondary-color);
    margin-bottom: 20px;
    line-height: 1.15;
}

.svc-row-desc {
    font-size: 16px;
    line-height: 1.8;
    color: var(--text-light);
    margin-bottom: 20px;
}

.svc-row-body {
    font-size: 15px;
    line-height: 1.9;
    color: var(--text-color);
}

.svc-row-projects {
    margin-top: 30px;
    padding-top: 26px;
    border-top: 1px solid rgba(13,24,35,0.08);
}

.svc-row-projects-title {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--text-muted);
    margin-bottom: 14px;
}

.svc-row-thumbs-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.svc-proj-thumb {
    width: 86px;
    height: 68px;
    border-radius: 6px;
    background-size: cover;
    background-position: center;
    display: block;
    flex: 0 0 auto;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.svc-proj-thumb:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(13,24,35,0.18);
}

/* Responsive */
@media (max-width: 1024px) {
    /* Base Responsive Restorations */
    .container { width: 90%; }
    .hero-title { font-size: 64px; }
    .desktop-nav { display: none; }
    .menu-toggle { display: flex; }
    .header-right { gap: 15px; }
    
    .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 40px; }
    .services-grid { grid-template-columns: repeat(2, 1fr); }
    .eng-inner { grid-template-columns: 1fr; }
    .eng-text-side { padding: 60px 30px; }
    .eng-image-side { height: 400px; }
    .journal-grid { grid-template-columns: repeat(2, 1fr); }
    .marquee-content h3 { font-size: 22px; margin: 0 25px; }

    /* Services Page Responsive */
    .compact-header { padding: 140px 0 60px 0; }
    .compact-header-container { flex-direction: column; align-items: flex-start; gap: 30px; }
    .ch-left, .ch-right { flex: 0 0 100%; }
    .ch-right { padding-left: 0; border-left: none; padding-top: 30px; border-top: 1px solid rgba(255,255,255,0.15); }
    .ch-title { font-size: 36px; }
    .manifesto-text { font-size: 18px; }
    
    .about-split-grid { grid-template-columns: 1fr; gap: 50px; }
    .hk-about-image-wrapper { height: 400px; }
    
    .news-card.featured { flex-direction: column; }
    .news-card.featured .news-img { height: 300px; flex: auto; }
    .news-grid { grid-template-columns: 1fr; }
    
    .certs-grid { grid-template-columns: repeat(2, 1fr); gap: 30px; }
    
    .refs-grid { grid-template-columns: repeat(2, 1fr); }
    .refs-grid.cols-4 { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 240px; }
    .refs-grid.cols-4 .ref-card.ref-big .ref-title { font-size: 24px; }

    .hr-split-grid { grid-template-columns: 1fr; gap: 50px; }
    
    .pillar-section { height: auto; }
    .pillar-container { flex-direction: column; }
    .pillar-card { height: 400px; border-right: none; border-bottom: 1px solid rgba(255,255,255,0.1); }

    .svc-row, .svc-row.reverse { flex-direction: column; gap: 30px; padding: 50px 0; }
    .svc-row-media-wrap { width: 100%; flex: 0 0 auto; }
    .svc-row-media { height: 280px; }
    .svc-row-title { font-size: 26px; }

    .category-body-grid { grid-template-columns: 1fr; gap: 20px; padding-top: 30px; }
    /* This is an intentionally horizontally-scrollable tab strip (nowrap +
       overflow-x:auto below), but as a grid item its default min-width:auto
       let that unwrapped content's full width leak out and blow up the
       whole grid track — the entire page rendered as wide as all the tabs
       laid end-to-end (over 1200px) instead of the tabs scrolling within
       a normal-width page. min-width:0 is the standard grid/flex fix. */
    .category-sidenav { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,0.95); backdrop-filter: blur(8px); padding: 14px 0; margin: 0 -20px; min-width: 0; }
    .category-sidenav-label { display: none; }
    .category-sidenav nav { flex-direction: row; gap: 22px; overflow-x: auto; padding: 0 20px; }
    .category-sidenav nav a { padding: 8px 0; border-left: none; border-bottom: 2px solid transparent; white-space: nowrap; flex: 0 0 auto; }
    .category-sidenav nav a.active { background: none; border-bottom-color: var(--primary-color); }
    .pillar-card:hover { flex: 1; } /* Disable flex grow on mobile */
    .pillar-card:hover .pillar-header { transform: none; }
    .pillar-details { display: none; /* Hide hover details on tablet/mobile for simplicity, or handle via JS */ }
    /* Alternative for mobile: always show details */
    .pillar-card { height: auto; padding-top: 150px; }
    .pillar-details { height: auto; opacity: 1; margin-top: 20px; display: block; }
    .pillar-list.double-col { column-count: 1; }
    .pillar-content { position: relative; padding: 40px 20px; }
    /* .pillar-overlay's gradient was tuned for the short desktop card where
       text only sits in the bottom sliver. On mobile the card grows tall
       (title + full list always shown) so the text spans up into the much
       lighter part of that gradient, letting busy photo detail (signage,
       bright sky) show through behind the upper list items. Darken evenly. */
    .pillar-overlay { background: linear-gradient(to bottom, rgba(13,24,35,0.55) 0%, rgba(13,24,35,0.8) 40%, rgba(13,24,35,0.92) 100%) !important; }
    
    /* Header & Nav */
    .nav-menu { gap: 20px; }
    .nav-menu a { font-size: 13px; }
    
    /* Hero — height must stay a definite value (not auto): .hero-slide is
       position:absolute + inset:0 and needs a real height from its ancestor
       chain (.hero -> .hero-slides) to render at all. height:auto here
       collapsed the slider to ~0px, hiding the bg image entirely and making
       the white header/logo/title invisible against the blank page. */
    .hero { height: 100vh; min-height: 560px; padding-bottom: 50px; }
    .hero .container { flex-direction: column; justify-content: center; padding-top: 140px; }
    .hero-content { max-width: 100%; margin-bottom: 40px; }
    /* On mobile the text stack spans the full image width/height (not just
       the left half like desktop), so the left-heavy gradient above leaves
       the lower-right mostly undarkened, right where the text/button sit.
       Use a fuller top-to-bottom scrim instead so text stays legible no
       matter which part of the photo is behind it. */
    .hero-slide::before {
        background: linear-gradient(180deg, rgba(13,24,35,0.35) 0%, rgba(13,24,35,0.55) 45%, rgba(13,24,35,0.88) 100%);
    }
    .hero-title { font-size: 48px; white-space: normal; line-height: 1.2; }
    .hero-desc br { display: none; } /* Prevent awkward breaks */

    /* Hero Pins Mobile Redesign */
    .pin-anchor {
        position: relative;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        top: auto !important;
        width: 100%;
        margin-bottom: 15px;
        transform: none !important; /* Disable fade-out movement */
        opacity: 1 !important;
    }
    .pin-line-diag, .pin-line-h, .pin-dot { display: none; }
    .pin-info {
        position: relative;
        left: auto !important;
        top: auto !important;
        bottom: auto !important;
        right: auto !important;
        width: 100%;
        max-width: 100%;
    }

    .about .container, .services-wrapper { grid-template-columns: 1fr; gap: 40px; }
    .about-visual { max-width: 100%; margin-left: 0; }
    .services-sticky-image { position: relative; top: 0; height: 400px; margin-bottom: 40px; }
    .impact-grid { grid-template-columns: repeat(2, 1fr); }
    .featured-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 230px; padding: 0 20px; }
    .feat-card.large { grid-column: span 2; grid-row: span 1; }
    .feat-card.large .feat-card-title { font-size: 22px; }
    .eng-inner { grid-template-columns: 1fr; }
    .eng-text-side { padding: 60px 30px; }
    .eng-image-side { height: 400px; }
    .journal-grid { grid-template-columns: repeat(2, 1fr); }
    .marquee-content h3 { font-size: 22px; margin: 0 25px; }
    
    /* Services Page Responsive */
    .page-hero { min-height: 300px; }
    .page-title { font-size: 48px; }
    .manifesto-text { font-size: 28px; }
    
    .editorial-row, .editorial-row.reverse { flex-direction: column; margin-bottom: 80px; }
    .proj-feat-head { flex-direction: column; align-items: flex-start; gap: 20px; }
    .proj-feat-heading { font-size: 26px; }
    .proj-feat-card { flex: 0 0 300px; height: 400px; }
    .ed-image-wrap, .editorial-row.reverse .ed-image-wrap.portrait, .editorial-row.reverse.panorama .ed-image-wrap { flex: 0 0 auto; width: 100%; height: 500px; margin-right: 0; }
    .ed-text-wrap, .editorial-row.reverse .ed-text-wrap { flex: 0 0 auto; width: 100%; padding: 40px 30px; }
    .ed-title { font-size: 42px; }
    
    /* Footer responsive */
    .footer-cta-inner { flex-direction: column; align-items: flex-start; gap: 40px; }
    .footer-cta-title { font-size: 40px; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
    .footer-brand { grid-column: span 2; }
    .footer-bottom-inner { flex-direction: column; gap: 16px; text-align: center; }
}

@media (max-width: 800px) {
    .desktop-nav { display: none; } /* Hide menu on smaller tablets/mobile for now */
    .pin-anchor { display: none !important; } /* Hide extra text pins completely to let image breathe */
}

@media (max-width: 640px) {
    .header { padding: 15px 0; }
    /* Logo + language switch + hamburger were overflowing past the right
       edge on real phone widths (~360-414px) and getting silently clipped
       by body's overflow-x:hidden — the hamburger was invisible, so the
       menu could not be opened at all. Shrink everything to fit. */
    .logo img { height: 50px; }
    .header-right { gap: 10px; }
    .lang-switch { padding: 6px 10px; gap: 4px; font-size: 12px; }
    .menu-toggle { padding: 8px 6px; gap: 5px; }
    .menu-line { width: 24px; }
    .hero-content { max-width: 100%; }
    .hero-title { font-size: 32px; white-space: normal; }
    .hero-desc { font-size: 14px; margin-bottom: 25px; }
    .hero-progress { padding: 0 20px; bottom: 20px; gap: 6px; }
    .proj-hero .hero-title { font-size: 32px; }
    .proj-hero .hero-progress {
        left: 0; right: 0; top: auto; bottom: 24px; transform: none;
        flex-direction: row; justify-content: center;
    }
    /* The per-dot caption (desktop) is centered on its own narrow dot, which
       overflows/clips on phone-width screens with long project names — so on
       mobile it's hidden in favor of a single full-width caption per slide
       (below), shown only for the active slide via the normal slide clipping. */
    .proj-hero .hero-progress-bar .proj-hero-navtext {
        display: none;
    }
    .proj-hero-mobile-caption {
        display: flex;
        position: absolute;
        left: 20px;
        right: 20px;
        bottom: 58px;
        z-index: 4;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
        text-align: center;
    }
    .proj-hero-navtext-name { font-size: 13px; }
    .proj-hero-navtext-loc { font-size: 12px; }

    /* Mobile text position is chosen per-slide in the admin (default "top"):
       text sits near the top, in the usually-quieter upper part of the
       photo, right below the header, with a scrim that darkens the top and
       fades out fast so the rest of the photo stays visible. Slides can opt
       back into the old centered layout (e.g. videos, where the busy area
       tends to sit lower and centering reads better) via "mobile-pos-center".
       Phone-only: tablets keep the desktop-style layout above. */
    .hero-slide.mobile-pos-top .container {
        justify-content: flex-start;
        padding-top: 100px;
    }
    .hero-slide.mobile-pos-top::before {
        background: linear-gradient(180deg, rgba(13,24,35,0.65) 0%, rgba(13,24,35,0.4) 32%, rgba(13,24,35,0.1) 55%, rgba(13,24,35,0.1) 100%);
    }
    .hero-slide.mobile-pos-center .container {
        justify-content: center;
        padding-top: 140px;
    }
    .hero-slide.mobile-pos-center::before {
        background: linear-gradient(180deg, rgba(13,24,35,0.35) 0%, rgba(13,24,35,0.55) 45%, rgba(13,24,35,0.88) 100%);
    }
    
    .impact-grid { grid-template-columns: 1fr; gap: 30px; margin-bottom: 20px; }
    .impact-number { font-size: 48px; }
    .impact-plus { font-size: 32px; vertical-align: top; }
    .impact-label { font-size: 13px; margin-top: 5px; }
    .eng-title { font-size: 28px; line-height: 1.2; }
    .featured-grid { grid-template-columns: 1fr; grid-auto-rows: 220px; gap: 16px; }
    .feat-card.large { grid-column: span 1; grid-row: span 1; }
    .feat-card.large .feat-card-title { font-size: 19px; }
    .journal-grid { grid-template-columns: 1fr; }
    .marquee-content h3 { font-size: 18px; margin: 0 15px; -webkit-text-stroke: 0.5px rgba(0,0,0,0.35); }
    .marquee-content img.partner-logo, .marquee-content h3 { height: 32px; line-height: 32px; margin: 0 15px; }
    
    /* Services Page Mobile */
    .ch-title { font-size: 32px; }
    .manifesto-text { font-size: 16px; }
    
    .pillar-title { font-size: 26px; }
    .pillar-list { font-size: 14px; }
    
    .certs-grid { grid-template-columns: 1fr; }
    
    .refs-grid { grid-template-columns: 1fr; }
    .refs-grid.cols-4 { grid-template-columns: 1fr; grid-auto-rows: 220px; }
    .refs-grid.cols-4 .ref-card.ref-big { grid-column: span 1; grid-row: span 1; }

    .hr-form-wrapper { padding: 30px 20px; }

    .kvkk-list { grid-template-columns: 1fr; }
    .doc-actions { margin-top: 4px; width: 100%; }
    .doc-download-btn { flex: 1; justify-content: center; }

    .footer-cta-title { font-size: 30px; }
    .footer-cta-btn { width: 100%; justify-content: center; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-brand { grid-column: span 1; }
}


/* COMPACT MODERN REFERENCE LIST */
.ref-list-section { padding: 40px 0; background-color: #f9fbfd; }
.ref-list-container { max-width: 1200px; margin: 0 auto; background: #ffffff; border-radius: 8px; box-shadow: 0 4px 20px rgba(0,0,0,0.03); overflow: hidden; border: 1px solid #eef2f6; }
.ref-list-header { display: grid; grid-template-columns: 2fr 1fr 1.5fr; padding: 12px 20px; background-color: #f1f5f9; color: var(--secondary-color); font-family: var(--font-heading); font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; font-size: 11px; border-bottom: 2px solid #e2e8f0; }
.ref-list-row { display: grid; grid-template-columns: 2fr 1fr 1.5fr; padding: 8px 20px; border-bottom: 1px solid #f1f5f9; transition: var(--transition); align-items: center; }
.ref-list-row:nth-child(even) { background-color: #fafbfc; }
.ref-list-row:last-child { border-bottom: none; }
.ref-list-row:hover { background-color: #f0f7fc; }
.ref-col-project { font-weight: 600; color: var(--secondary-color); font-size: 12px; }
.ref-col-location { color: var(--text-light); font-size: 11px; font-weight: 500; display: flex; align-items: center; gap: 6px; }
.ref-col-employer { color: var(--text-color); font-size: 11px; font-weight: 500; }

.section-title-lg {
    font-family: var(--font-pilat);
    color: var(--secondary-color);
    font-size: 32px;
    overflow-wrap: break-word;
}

/* ====================================================
   MOBILE RESPONSIVE — SITE-WIDE PASS (2026-08-28)
   ==================================================== */

/* Single long uppercase words (e.g. "PROJELERİMİZ") in these headings were
   wider than a phone viewport and had no way to wrap, so they got silently
   clipped at the screen edge by body's overflow-x:hidden. */
@media (max-width: 480px) {
    .section-title-lg { font-size: 24px; }
}

/* Same grid/flex-blowout family of bug as .about-content above: a no-wrap
   flex row of stat boxes was forcing its column wider than the viewport. */
@media (max-width: 640px) {
    .about-stats { flex-wrap: wrap; row-gap: 24px; column-gap: 30px; }
}

/* Logo marquee: the animation moves a fixed px/sec regardless of viewport.
   On a narrow phone screen that same speed means far more logos flash
   through the small visible window every second than on desktop, so it
   reads as "too fast to see" even though the physical speed is identical.
   Slow the cycle down so a comfortable number of logos pass per second. */
@media (max-width: 768px) {
    .marquee-content { animation-duration: 48s; }
}
@media (max-width: 480px) {
    .marquee-content { animation-duration: 60s; }
}

/* Blanket safety net: headings should never force horizontal overflow,
   even ones we haven't specifically audited. Lets a too-long word break
   instead of silently overflowing past the (clipped) viewport edge. */
h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }

/* Homepage "Services Interactive Scroll": items rely on :hover (mouseenter
   in JS) to switch from light-gray #e0e0e0 to readable blue. Touch devices
   have no hover, so every item except the first stayed near-invisible
   light-gray-on-white forever — most of this section was unreadable on
   mobile. Make everything readable regardless of active/hover state. */
@media (max-width: 1024px) {
    .service-item {
        color: var(--secondary-color);
        font-size: 22px;
        padding: 16px 0;
    }
    .service-item.active, .service-item:hover {
        color: var(--primary-color);
        padding-left: 12px;
    }
    .service-item::after { display: none; }
}

/* Reduce oversized section padding on tablet/mobile so content
   doesn't feel like it's mostly empty space on a small screen */
@media (max-width: 768px) {
    .about, .services, .featured-projects, .journal, .about-split-section,
    .timeline-section, .news-section, .certs-section, .refs-section,
    .hr-section, .kvkk-section {
        padding-top: 70px;
        padding-bottom: 70px;
    }
    .global-impact { padding-top: 60px; padding-bottom: 60px; }
}

/* Fullscreen overlay nav menu: on short phone screens the 7 links + 2
   dropdowns + footer badly overflow the viewport with no way to scroll
   to the lower items (İletişim, KVKK). Make it compact + scrollable. */
@media (max-width: 768px) {
    .overlay-menu-inner {
        justify-content: flex-start;
        height: 100%;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding-top: 100px;
        padding-bottom: 40px;
    }
    .overlay-nav { gap: 6px; }
    .overlay-link { font-size: 26px; gap: 14px; }
    .overlay-num { font-size: 11px; }
    .overlay-dropdown .arr { font-size: 18px; }
    .overlay-submenu { padding-left: 28px; gap: 10px; margin-top: 8px; margin-bottom: 8px; }
    .overlay-submenu a { font-size: 16px; }
    .overlay-close { top: 18px; right: 20px; font-size: 34px; }
    .overlay-footer { margin-top: 24px; padding-top: 20px; flex-direction: column; gap: 16px; align-items: flex-start; }
}

/* Referanslarımız — "Referanslar Listesi" tablosu: 3 sabit kolon dar
   ekranda birbirine giriyordu. Küçük ekranda alt alta kart haline getir. */
@media (max-width: 700px) {
    .ref-list-header { display: none; }
    .ref-list-row {
        grid-template-columns: 1fr;
        gap: 4px;
        padding: 14px 16px;
    }
    .ref-col-project { font-size: 14px; }
    .ref-col-location, .ref-col-employer { font-size: 12px; }
}

/* Small phone polish */
@media (max-width: 480px) {
    .filter-btn { padding: 8px 18px; font-size: 13px; }
    .ref-title { font-size: 18px; }
    .footer-cta-title { font-size: 26px; }
}

/* Cookie consent bar (KVKK) */
.cookie-consent-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    background: var(--secondary-color);
    color: var(--white);
    padding: 16px 5%;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.cookie-consent-bar.cookie-consent-hidden {
    transform: translateY(100%);
    opacity: 0;
    pointer-events: none;
}

.cookie-consent-inner {
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

.cookie-consent-text {
    font-size: 13px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.85);
    margin: 0;
    flex: 1;
    min-width: 220px;
}

.cookie-consent-text a {
    color: var(--white);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.cookie-consent-actions {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}

.cookie-consent-btn {
    padding: 9px 20px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: var(--transition);
}

.cookie-consent-reject {
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: var(--white);
}

.cookie-consent-reject:hover {
    background: rgba(255, 255, 255, 0.08);
}

.cookie-consent-accept {
    background: var(--primary-color);
    color: var(--white);
    border: 1px solid var(--primary-color);
}

.cookie-consent-accept:hover {
    filter: brightness(1.1);
}

@media (max-width: 640px) {
    .cookie-consent-inner { flex-direction: column; align-items: stretch; gap: 12px; }
    .cookie-consent-actions { justify-content: stretch; }
    .cookie-consent-btn { flex: 1; }
}
/* Google Fonts self-hosted locally — generated for the admin font picker.
   Includes both "latin" and "latin-ext" subsets per weight so Turkish
   characters (İ ı Ğ ğ Ş ş Ö ö Ü ü Ç ç) always render in the chosen font
   instead of silently falling back to a different system font. */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/inter/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/inter/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/inter/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/inter/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/inter/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/inter/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/inter/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/inter/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/inter/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/inter/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/poppins/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/poppins/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/poppins/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/poppins/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/poppins/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/poppins/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/poppins/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/poppins/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/poppins/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/poppins/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/montserrat/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/montserrat/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/montserrat/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/montserrat/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/montserrat/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/montserrat/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/montserrat/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/montserrat/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/montserrat/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/montserrat/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/roboto/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/roboto/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/roboto/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/roboto/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/roboto/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/roboto/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/roboto/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/roboto/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/roboto/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/roboto/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/opensans/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/opensans/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/opensans/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/opensans/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/opensans/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/opensans/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/opensans/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/opensans/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/opensans/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/opensans/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/nunito/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/nunito/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/nunito/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/nunito/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/nunito/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/nunito/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/nunito/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/nunito/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/nunito/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/nunito/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/worksans/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/worksans/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/worksans/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/worksans/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/worksans/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/worksans/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/worksans/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/worksans/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/worksans/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Work Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/worksans/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/rubik/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/rubik/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/rubik/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/rubik/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/rubik/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/rubik/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/rubik/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/rubik/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/rubik/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/rubik/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/manrope/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/manrope/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/manrope/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/manrope/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/manrope/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/manrope/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/manrope/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/manrope/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/manrope/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/manrope/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/raleway/300-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('../fonts/gf/raleway/300-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/raleway/400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/gf/raleway/400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/raleway/500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/gf/raleway/500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/raleway/600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/gf/raleway/600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/raleway/700-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/gf/raleway/700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}