body {
    margin: 0;
    font-family: 'Poppins', sans-serif !important;
}
.navbar {
    padding: 2rem 7rem;              /* küçük ekranlarda 1rem kenar boşluğu */
    box-sizing: border-box;       /* padding’i hesaba kat */
    font-weight: normal !important;
  }
  


/* 1) Header’ı fixed yap: */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: transparent;
    box-shadow: none;
    transition: background 0.3s ease, box-shadow 0.3s ease;
    z-index: 999;
  
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 60px;
  }
  
  /* 2) Scroll sonrası beyaz + gölge */
  .header.scrolled {
    background: rgba(255,255,255,0.95) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
  }
  
  /* 3) Scroll sonrası linkleri koyu yap */
  .header.scrolled a {
    color: #333 !important;
  }
/*   
.header {
    background: linear-gradient(90deg, #a71725, #444444) !important;
    transition: background 0.3s ease, box-shadow 0.3s ease;
    padding: 20px 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: white;
    position: sticky;
    top: 0;
    z-index: 999;
    
}

.header .logo {
    font-size: 28px;
    font-weight: bold;
}

.header .logo span {
    background: linear-gradient(to right, #d66bf6, #ff69b4);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
} */

.header .nav-menu {
    display: flex;
    align-items: center;
    gap: 25px;
}

.header .nav-menu a {
    text-decoration: none;
    color: #ccc;
    font-size: 16px;
    padding: 8px 20px;
    border-radius: 20px;
    transition: background-color 0.3s, color 0.3s;
}

.header .nav-menu a:hover {
    color: white;
}

.header .nav-menu .resources {
    background-color: #c94ea7;
    color: white;
}

.header .nav-menu .resources:hover {
    background-color: #b53b94;
}

.header .nav-menu .get-started {
    background-color: #7b23fa;
    color: white;
}

.header .nav-menu .get-started:hover {
    background-color: #a71725;
}

.menu-buttons {
    display: flex;
    align-items: center;
    gap: 25px;
}

.menu-buttons ul {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 25px;
    margin: 0;
    padding: 0;
}

.menu-buttons ul li {
    display: flex;
    align-items: center;
}

.menu-buttons ul li a {
    text-decoration: none;
    color: #333;
    /* font-weight: 500; */
    display: inline-flex;
    align-items: center;
}

.cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    background-color: #007bff;
    color: white;
    text-decoration: none;
    border-radius: 5px;
}

/* Hero Section */
.hero {
    /* background: linear-gradient(to right, #32054b, #0a4b65); */
    background: linear-gradient(90deg, #a71725, #444444);
    color: white;
    padding: 120px 20px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 100px;
    text-align: left;
    font-family: 'Poppins', sans-serif !important;



}
.demo-button:hover{
    box-shadow: 0 0 8px #ff8f56 !important;

}

.hero h1 {
    margin-bottom: 20px;
}

.hero p {
    margin-bottom: 30px;
}

.hero .demo-button {
    padding: 12px 24px;
    background-color: white;
    /* color: #007bff; */
    color: linear-gradient(90deg, #a71725, #444444);
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background-color 0.3s, color 0.3s;
}

.hero .demo-button:hover {
    background-color: #e6e6e6;
    color: #0056b3;
}

.main-text {
    font-size: 50px;
}


.section {
    padding: 100px 20px 50px 20px;
    text-align: center;
}

.section h2 {
    color: #a71725;
    font-size: 32px;
    margin-left: 200px;
    text-align: left;
}

.section h1 {
    font-size: 64px;
    font-weight: bold;
    margin: 0 0 40px 0;
    color:black;
}

.section p {
    color: #555;
    font-size: 18px;
    max-width: 600px;
    margin-left: 200px;
    text-align: left;

}

.stats-section {
    background-color: #f5f1fa;
    margin: 60px auto;
    padding: 80px 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
    max-width: 1100px;
    clip-path: polygon(0 10%, 100% 0, 100% 90%, 0% 100%);
}

.stats-section .graphic {
    display: grid;
    grid-template-columns: repeat(5, 30px);
    grid-gap: 10px;
}

.stats-section .graphic .person {
    width: 30px;
    height: 60px;
    background-color: #a71725;
    border-radius: 5px;
}

.stats-section .graphic .person.empty {
    background-color: transparent;
    border: 2px solid #a71725;
}

.stats-section .info-div {
    display: flex;
    align-items: baseline;
    gap: 20px;
    text-align: left;
    max-width: 600px;
}

.stats-section .info-div h3 {
    color: #a71725;
    font-size: 72px;
    margin: 0;
    font-weight: bold;
    line-height: 1;
}

.stats-section .info-div p {
    font-size: 22px;
    color: #333;
    margin: 0;
    line-height: 1.4;
}

.quote-section {
    background-color: #0b0b15;
    background-image: radial-gradient(#333 1px, transparent 1px);
    background-size: 20px 20px;
    color: white;
    text-align: center;
    padding: 60px 20px;
}

.quote-section h2 {
    font-size: 36px;
    font-style: italic;
    font-weight: normal;
    color: white;
}

.optimize-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 80px;
    padding: 100px 60px;
    max-width: 1200px;
    margin: 0 auto;
}

.optimize-section .left-box {
    position: relative;
}

.optimize-section .left-box .background-shape {
    position: absolute;
    top: -20px;
    left: -20px;
    width: 500px;
    height: 350px;
    border: 2px solid #a71725;
    transform: rotate(-3deg);
    z-index: 0;
}

.optimize-section .left-box .image-box {
    background-color: white;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    padding: 40px;
    z-index: 1;
    position: relative;
}

.optimize-section .left-box .image-box img {
    width: 400px;
    border-radius: 10px;
}

.optimize-section .right-box {
    max-width: 500px;
}

.optimize-section .right-box .tag {
    background-color: #a71725;
    color: white;
    padding: 6px 20px;
    font-size: 14px;
    border-radius: 5px;
    display: inline-block;
    margin-bottom: 20px;
    margin-top: -35px;
}

.optimize-section .right-box h2 {
    font-size: 48px;
    color: #222;
    margin: 20px 0 20px 0; 
}

.optimize-section .right-box p {
    font-size: 18px;
    color: #555;
    line-height: 1.6;
    margin-bottom: 30px;
}

.optimize-section .right-box .cta-button {
    background-color: #a71725;
    color: white;
    padding: 14px 30px;
    font-size: 16px;
    border-radius: 25px;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.3s;
}

.optimize-section .right-box .cta-button:hover {
    /* background-color: #8e2be2; */
}

.content-creation-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 80px;
    padding: 100px 60px;
    max-width: 1200px;
    margin: 0 auto;
}

.content-creation-section .content-left {
    max-width: 500px;
}

.content-creation-section .content-left .content-badge {
    background-color: #a71725;
    color: white;
    padding: 6px 20px;
    font-size: 14px;
    border-radius: 5px;
    display: inline-block;
    margin-bottom: 20px;
}

.content-creation-section .content-left h2 {
    font-size: 48px;
    color: #222;
    margin: 0 0 20px 0;
}

.content-creation-section .content-left p {
    font-size: 18px;
    color: #555;
    line-height: 1.6;
    margin-bottom: 30px;
}

.content-creation-section .content-left .content-button {
    background-color: #a71725;
    color: white;
    padding: 14px 30px;
    font-size: 16px;
    border-radius: 25px;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.3s;
}

.content-creation-section .content-left .content-button:hover {
    /* background-color: #6b00e0; */
}

.content-creation-section .content-right {
    position: relative;
}

.content-creation-section .content-right .content-background-shape {
    position: absolute;
    top: -20px;
    left: -20px;
    width: 500px;
    height: 350px;
    border: 2px solid #a71725;
    transform: rotate(-3deg);
    z-index: 0;
}

.content-creation-section .content-right .content-image-box {
    background-color: white;
    border-radius: 15px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    padding: 40px;
    z-index: 1;
    position: relative;
}

.content-creation-section .content-right .content-image-box img {
    width: 400px;
    border-radius: 10px;
}

.testimonial-slider {
    position: relative;
    overflow: hidden;
    max-width: 1200px;
    margin: 100px auto;
}

.testimonial-wrapper {
    display: flex;
    transition: transform 0.5s ease;
}

.testimonial-slide {
    display: flex;
    justify-content: space-between;
    min-width: 100%;
    border: 1px solid #a71725;
}

.testimonial-left {
    background-color: #fff;
    padding: 60px 40px;
    flex: 1;
}

.testimonial-left img {
    height: 40px;
    margin-bottom: 20px;
}

.testimonial-left h2 {
    font-size: 42px;
    color: #222;
    margin-bottom: 20px;
}

.testimonial-left p {
    font-size: 18px;
    color: #555;
    margin-bottom: 40px;
}

.testimonial-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.testimonial-stat-box {
    background-color: #eaf7ea;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
}

.testimonial-stat-box strong {
    font-size: 24px;
    display: block;
    color: #222;
    margin-bottom: 5px;
}

.testimonial-stat-box span {
    color: #555;
}

.testimonial-right {
    background-color: #05050d;
    color: white;
    padding: 60px 70px;
    flex: 1;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 10% 100%);
    position: relative;
}

.testimonial-right .quote {
    color: #a71725;
    font-size: 60px;
    line-height: 0.5;
    margin-bottom: 20px;
}

.testimonial-right p {
    font-size: 18px;
    color: #ccc;
    margin-bottom: 30px;
}

.testimonial-right .author {
    color: white;
    font-weight: bold;
    margin-bottom: 5px;
}

.testimonial-right .position {
    color: #aaa;
    font-size: 14px;
}

.testimonial-nav {
    text-align: center;
    margin-top: 30px;
}

.testimonial-nav button {
    background-color: white;
    border: 2px solid #a71725;
    color: #a71725;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 20px;
    cursor: pointer;
    margin: 0 10px;
    transition: background-color 0.3s;
}

.testimonial-nav button:hover {
    background-color: #a71725;
    color: white;
}

.cta-section {
    background: linear-gradient(135deg, #0a032e, #120032);
    color: white;
    text-align: center;
    padding: 120px 20px;
    position: relative;
    overflow: hidden;
}

.cta-section h5 {
    color: #bbb;
    font-size: 16px;
    margin-bottom: 20px;
}

.cta-section h2 {
    font-size: 48px;
    max-width: 800px;
    margin: 0 auto 40px auto;
    line-height: 1.3;
}

.cta-section .cta-button {
    background-color: #a71725;
    color: white;
    padding: 14px 30px;
    border-radius: 25px;
    font-size: 16px;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.3s;
}

.cta-section .cta-button:hover {
    background-color: #a71725;
}

.cta-avatars img,
.cta-icons img {
    position: absolute;
    border-radius: 50%;
    object-fit: cover;
}

.cta-avatars img {
    width: 60px;
    height: 60px;
}

.cta-avatars img.large {
    width: 120px;
    height: 120px;
}

.cta-icons img {
    width: 30px;
    height: 30px;
    filter: invert(30%) sepia(80%) saturate(500%) hue-rotate(230deg) brightness(100%) contrast(100%);
}

.cta-avatars img.avatar1 {
    top: 20%;
    left: 10%;
}

.cta-avatars img.avatar2 {
    top: 10%;
    right: 15%;
}

.cta-avatars img.avatar3 {
    bottom: 10%;
    left: 20%;
}

.cta-avatars img.avatar4 {
    top: 30%;
    right: 30%;
}

.cta-avatars img.avatar5 {
    bottom: 0;
    right: 0;
}

.cta-avatars img.avatar6 {
    top: 5%;
    left: 50%;
}

.cta-avatars img.avatar7 {
    bottom: 20%;
    right: 20%;
}

.cta-icons img.icon1 {
    top: 20%;
    left: 40%;
}

.cta-icons img.icon2 {
    top: 40%;
    right: 10%;
}

.cta-icons img.icon3 {
    bottom: 20%;
    left: 30%;
}

.cta-icons img.icon4 {
    bottom: 40%;
    right: 30%;
}

.footer {
    background-color: #05050d;
    color: #fff;
    padding: 60px 40px 20px 40px;
    /* font-family: 'Poppins', sans-serif; */
    font-size: 14px;
}

.footer-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1200px;
    margin: 0 auto 40px auto;
}

.footer-logo {
    font-size: 28px;
    font-weight: bold;
}

.footer-logo span {
    color: #d66bf6;
}

.footer-column h4 {
    font-weight: bold;
    margin-bottom: 15px;
    font-size: 14px;
}

.footer-column ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-column ul li {
    margin-bottom: 8px;
}

.footer-column ul li a {
    text-decoration: underline;
    color: #fff;
    font-weight: normal;
    font-size: 14px;
}

.footer-bottom {
    border-top: 1px solid #333;
    padding: 20px 0;
    text-align: center;
    color: #aaa;
    font-size: 12px;
}

.footer-bottom a {
    color: #aaa;
    text-decoration: underline;
    font-size: 12px;
}

.footer-dot {
    width: 5px;
    height: 5px;
    background-color: #a71725;
    border-radius: 50%;
    display: inline-block;
    margin: 0 8px;
}


/* diagonal arka plan */
.section-bg{
      background:radial-gradient(rgba(255,255,255,.05) 0%,transparent 55%) center/8px 8px,
               linear-gradient(130deg,#131027 0%,#8b0606 60%,#0b0b15 100%) !important;
    clip-path:polygon(0 0,100% 0,100% 85%,0 100%);
    padding:110px 0 160px;
}

/* ------------------------------ ESAS GRID ------------------------------ */
.wrapper{
    max-width:1360px;
    /* margin:0 auto; */
    margin:100px auto;
    display:grid;
    grid-template-columns: 1fr 620px;
    gap:60px;
}

/* ------------------------------ SOL BAŞLIK ------------------------------ */
.heading{
    font-size:50px;           /* tam ekranınkine çok yakın */
    line-height:1.15;
    font-weight:700;
}
.sub{
    margin-top:35px;
    font-size:20px;
    opacity:.8;
}

/* ------------------------------ SAĞ BLOK (relative) ------------------------------ */
.side{position:relative}
.card{
    position:absolute;
    background:#181828;
    border-radius:18px;
    padding:32px 36px;
    width:540px;
}
.card h3{font-size:22px;margin-bottom:12px}
.card p{font-size:16px;line-height:1.45;color:#b6b6c8}

/* 1. kart */
.card.k1{top:-40px;right:20px}

/* 2. kart (AI-Driven) */
.card.k2{
    top:190px;left:0;
    display:flex;justify-content:space-between;align-items:center;
    width:660px;
}
.card.k2 .info{max-width:360px}
.stats small{font-size:14px;color:#a7a7b7}
.stats strong{display:block;font-size:40px;margin:4px 0}
.stats span{color:#39d17b;font-size:18px}


/* ------------------------------ RENKLİ ETİKET KUTULARI ------------------------------ */
.tag{
    position:absolute;
    padding:18px 28px;
    border-radius:10px;
    font-weight:700;
    font-size:20px;
    white-space:nowrap;
}
.t1{top:-20px;right:-120px;background:#f67e25}
.t2{top:115px;right:-90px;background:#7b29ff}
.t3{top:430px;left:130px;background:#b6b6c8}

/* ------------------------------ RESPONSIVE ------------------------------ */
@media (max-width:1100px){
   .wrapper{grid-template-columns:1fr}
   .side{height:760px;margin-top:80px}
   .card.k1{top:0;left:50%;transform:translateX(-50%)}
   .card.k2{top:240px;left:50%;transform:translateX(-50%)}
   .t1{top:-80px;right:auto;left:50%;transform:translateX(-50%)}
   .t2{top:100px;right:auto;left:50%;transform:translateX(-50%)}
   .t3{top:560px;left:50%;transform:translateX(-50%)}
}


/* === ABOUT HERO STYLES === */
.about-hero{
    padding: 100px 24px 120px;
    background:#fff;             
    color:#222;                  
    /* font-family: 'Poppins', sans-serif; */
}

.about-container{
    max-width:1100px;             
    margin:0 auto;
}

.about-hero h1{
    font-size:48px;
    line-height:1.25;
    font-weight:800;
    text-align:center;
    margin:0 0 60px 0;
}

.about-hero p{
    font-size:18px;
    line-height:1.7;
    margin:0 0 32px 0;
}

.about-hero p.linkish{
    color:#5d32ff;               
    font-weight:700;
    cursor:pointer;
    margin-bottom:40px;
}

.about-hero p.linkish:hover{
    text-decoration:underline;
}

.about-hero strong{
    font-weight:800;
}


/* ---------- USP Section ---------- */
.usp{
    padding:100px 24px;
    text-align:center;
    /* font-family:"Barlow",Helvetica,Arial,sans-serif; */
}

.usp h2{
    font-size:42px;
    font-weight:800;
    margin:0 0 12px;
}

.usp-sub{
    font-size:18px;
    margin:0 0 60px;
    color:#555;
}

.usp-grid{
    --gap:40px;
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:var(--gap);
    max-width:1200px;
    margin:0 auto;
}

.usp-card{
    border:2px solid #a47cff;         
    border-radius:12px;
    padding:50px 28px 60px;
    display:flex;
    flex-direction:column;
    align-items:center;
}

.usp-icon{
    width:64px;
    height:64px;
    margin-bottom:32px;
    stroke:#222;
    fill:none;
}

.usp-card h3{
    font-size:24px;
    font-weight:700;
    color:#222;
    /* color:white; */
    margin:0 0 16px;
}

.usp-card p{
    font-size:16px;
    color:#666;
    line-height:1.55;
    max-width:340px;
    margin:0;
}

body.dark .usp-card{
    border-color:#5d32ff;
    background:rgba(255,255,255,0.02);
}
body.dark .usp-card h3{color:#eee;}
body.dark .usp-card p{color:#bbb;}
body.dark .usp-icon{stroke:#eee;}


.usp{
    background:#fff;       
    color:#1a1a1a;           
}

.usp h2        {color:#333;}
.usp .usp-sub  {color:#555;}

.usp-card{
    border:2px solid #a71725; 
    background:#fff;          
}

/* --------- TRUSTED‑BY STRIP --------- */
.trusted-by{
    padding:80px 24px 100px;
    text-align:center;
    background:radial-gradient(ellipse at center,
                rgba(109,76,255,.08) 0%,
                rgba(0,0,0,.9) 100%);
    /* font-family:"Barlow",sans-serif; */
}

.trusted-by h2{
    font-size:40px;
    font-weight:800;
    color:#fff;
    margin:0 0 60px;
}

.logo-row{
    --gap:80px;                
    list-style:none;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:var(--gap);
    padding:0;
    margin:0;
}

.logo-row li{
    flex:0 0 auto;
}

.logo-row img{
    height:110px;               
    width:auto;
    opacity:.85;
    transition:opacity .3s;
}

.logo-row img:hover{
    opacity:1;
}
.image-div img{
    width: 550px;
    height: 550px;
    border-radius: 0.5rem;
    box-shadow: 0 8px 24px rgba(0,0,0,0.15);
    margin-top: 20px;
}

@media(max-width:992px){
    .logo-row{
        --gap:50px;
    }
    .logo-row img{height:90px;}
}

/*  Mobil – iki satır hâlinde */
@media(max-width:600px){
    .logo-row{
        --gap:32px;
    }
    .logo-row img{height:70px;}
}
@media (max-width:480px){
    .side{display:none;}
}
/* ---- genel header ---- */
.header{
    display:flex;align-items:center;justify-content:space-between;
    padding:0 24px;height:70px;
}
/* Scroll sonrası beyazlaştırmak için */
.header.scrolled {
    background: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  }
  
  /* Scroll sonrası link & hamburger rengi */
  .header.scrolled a,
  .header.scrolled .hamburger svg path {
    color: #333;
  }



.nav-links{display:flex;gap:40px;align-items:center;}
.nav-links a{color:#fff;text-decoration:none;font-weight:bold; font-size:15px;}
.nav-links .cta{
    background: linear-gradient(90deg, #a71725, #444444);
    padding:10px 22px;
    border-radius:24px;
}

.hamburger{display:none;background:none;border:0;cursor:pointer}

/* -------- MOBİL -------- */
@media(max-width:768px){
    .hamburger{display:block;}            
    .nav-links{
        position:fixed;                  
        top:0;right:-100%;             
        width:70%;height:100%;
        flex-direction:column;gap:28px;
        padding:70px 120px 40px 4px;
        /* background:#05050d; */
        transition:right .35s ease;
    }
    .nav-links a{font-size:18px;}
    .nav-links.open{right:0;}            
    .optimize-section .right-box .tag{
        margin-left: -100px;
    }
}

.hero{
    display:flex;           
    justify-content:space-between;
    align-items:center;
    gap:60px;
    margin-top: -10px;
}

/* -----------------------------------------------------
   Mobil ve küçük tablet (< 768 px) düzeni
----------------------------------------------------- */
@media (max-width:768px){
    .hero{
        flex-direction:column;       
        text-align:center;           
        padding:60px 20px;      
        margin-top:30px !important;
    }
    /* Görsel kutusu */
    .image-div{
        order:2;                   
        width:80%;               
        max-width:360px;             
        margin-top:32px;             
    }
    .image-div img{
        width:300px;                
        height:300px;               
    }
}
@media (max-width:768px){
    .section{
        width:100%;              
        max-width:none;          
        margin:0;                 
        padding:40px 16px 60px;   
        text-align:center;      
    }

    .section h2,          
    .section h1,          
    .section p{        
        margin:0 0 24px; 
    }

    .section h1{
        font-size:8vw;    
        line-height:1.1;
    }

    .section h2{
        font-size:6vw;
        color:#9b4cff;   
    }

    .section p{
        font-size:4.2vw;
        line-height:1.4;
        max-width:none;  
    }
}
@media (max-width: 768px){
    .stats-section .graphic{
        display:none;
    }

    .stats-section .info-div{
        max-width:100%;
        text-align:center;
        justify-content:center;   /* sayıya + paragrafa ortalama */
    }
}


/* ===  MOBİL DÜZEN: optimize-section  ==================== */
@media (max-width: 768px){

    /* Bölümü dikey akışa geçir */
    .optimize-section{
        flex-direction: column;      /* sol‑sağ yerine üst‑alt */
        gap: 40px;                   /* görsel ile metin arası */
        padding: 60px 20px;          /* kenarlıkları daralt */
        text-align: center;          /* başlık ve paragrafı ortala */
    }
    .optimize-section .left-box{
         margin-bottom: 26px
    }
    .optimize-section .left-box,
    .optimize-section .right-box{
        max-width: 100%;
    }

    .optimize-section .left-box .background-shape{
        left: 0;
        top: 0;
        transform: none;           
        width: 100%;
        height: 100%;
    }

    /* Resmin kendisi ekrana göre küçülsün */
    .optimize-section .left-box .image-box img{
        width: 100%;
        max-width: 350px;            /* istersen üst sınır */
        height: auto;
    }

    /* Sağ (metin) kutusu */
    .optimize-section .right-box h2{
        font-size: 32px;
        line-height: 1.2;
    }
    .optimize-section .right-box p{
        font-size: 16px;
    }

    /* CTA butonu ortala */
    .optimize-section .right-box .cta-button{
        margin: 0 auto;
        display: inline-block;
    }
}
/* Mobilde 'Boost Conversions' bloğunda görsel üste gelsin */
@media (max-width: 768px){

    .cta-avatars , .cta-icons{
        display:none;
    }
    /* Blok yine sütuna dönsün */
    .content-creation-section{
        flex-direction: column;   /* üst‑alt diziliş */
        gap: 40px;
        padding: 60px 20px;
        text-align: center;
    }

    /* Görsel kutusunu ilk sıraya taşı */
    .content-creation-section .content-right{
        order: -1;                /* önce gel */
        max-width: 100%;
    }

    /* Metin kutusu normal sırada kalır */
    .content-creation-section .content-left{
        max-width: 100%;
    }

    /* Görsel ve çerçevesi ekran genişliğine uyumlu olsun */
    .content-creation-section .content-right .content-image-box img{
        width: 100%;
        max-width: 350px;         /* isteğe bağlı üst sınır */
        height: auto;
    }
    .content-creation-section .content-right .content-background-shape{
        left: 0;
        top: 0;
        transform: none;
        width: 100%;
        height: 100%;
    }
}
@media (max-width: 768px){

    .side{
        display: none;
    }
    .heading{
        font-size: 55px;
    }
    .about-container{
        word-break: break-word;
    }
    .wrapper{
        margin: 0px 0px 0px 30px;
    }

    .testimonial-slider{overflow:hidden;padding:0 0 40px}

    .testimonial-wrapper{
        display:flex;                 
        transition:transform .45s ease;
        width:100%;
    }

    .testimonial-slide{
        flex:0 0 100%;               
        min-width:100%;
        display:flex;flex-direction:column;
        border:none;                  
        gap:24px;
        padding:0 20px;
    }

    .testimonial-left{
        order:1;padding:0;
    }
    .testimonial-left img{width:140px;height:auto;margin-bottom:14px}
    .testimonial-left h2{font-size:22px;margin:12px 0}
    .testimonial-left p{font-size:15px;margin-bottom:24px}
    .testimonial-stats{
        display:flex;flex-direction:column;gap:12px;margin-bottom:12px;
    }
    .testimonial-stat-box{padding:14px;border-radius:8px}

    .testimonial-right{
        order:2;display:block;
        clip-path:none;border-radius:10px;
        padding:28px 24px;background:#05050d;
    }
    .testimonial-right .quote{font-size:48px;margin-bottom:10px}
    .testimonial-right p{font-size:15px;margin-bottom:16px}
    .testimonial-right .author{font-size:16px}
    .testimonial-right .position{font-size:13px;color:#888}

  
    .testimonial-nav button{
        width:40px;height:40px;
        padding:0;font-size:20px;border-radius:50%;
    }
}

/* =================================================================
   ❼ FOOTER – mobilde de görünür durumda zaten, yan kaymayı engelle
================================================================= */
@media(max-width:768px){
   .footer{padding:40px 20px}
   .footer-top{flex-direction:column;gap:24px;align-items:flex-start}
}


:root{
    --purple:#a71725;
    --bg-dark:#05050d;
    --bg-card:#111014;
    --radius:12px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
    /* font-family: 'Poppins', sans-serif; */
    /* background:radial-gradient(rgba(255,255,255,.05) 0%,transparent 55%) center/8px 8px,
               linear-gradient(130deg,#131027 0%,#1f1340 60%,#0b0b15 100%); */
    color:#fff;
    line-height:1.45;
}

/* ---------------  Layout --------------- */
.touch-container{
    max-width:1360px;
    margin:120px auto 80px;
    display:grid;
    grid-template-columns:420px 1fr;
    gap:60px;
    padding:0 24px;
    
}
@media(max-width:992px){
    .touch-container{grid-template-columns:1fr;}
}

/* ---------------  LEFT SIDE --------------- */
.summary{
    /* sola hizalı açıklama kutusu */
}
.summary h1{
    font-size:68px;line-height:1.1;font-weight:700;margin-bottom:24px;
}
.summary p.lead{font-size:22px;max-width:340px;margin-bottom:80px}
.contact-line{display:flex;align-items:flex-start;gap:16px;margin-bottom:34px}
.contact-line svg{flex:0 0 22px;margin-top:4px;fill:none;stroke:var(--purple);stroke-width:2}
.contact-line a{color:#fff;text-decoration:none}
.contact-line small{display:block;color:#bbb;font-size:15px;margin-top:4px}

/* ---------------  RIGHT FORM --------------- */
.touch-form{
    background:var(--bg-card);
    border-radius:var(--radius);
    padding:60px 50px;
}
.touch-form h2{font-size:40px;margin-bottom:36px}
.form-options{display:flex;gap:36px;margin-bottom:36px}
.form-options label{display:flex;align-items:center;gap:6px;font-size:16px;cursor:pointer}
input[type="radio"]{accent-color:var(--purple);transform:scale(1.1)}

input[type="text"],
input[type="email"],
textarea{
    width:100%;
    padding:14px 18px;
    background:#0b0b15;
    border:1px solid var(--purple);
    border-radius:var(--radius);
    color:#fff;font-size:15px;
}
textarea{min-height:120px;resize:vertical}
.form-field{margin-bottom:26px}

.btn-submit{
    background:var(--purple);
    border:0;
    padding:16px 34px;
    color:#fff;font-size:18px;
    border-radius:40px;
    cursor:pointer;
}
.btn-submit:hover{opacity:.85}

/* ---------------  SMALL DEVICES --------------- */
@media(max-width:768px){
    .touch-container{margin:80px auto 60px}
    .summary h1{font-size:46px}
    .summary p.lead{font-size:18px;margin-bottom:60px}
    .touch-form{padding:40px 30px}
    .touch-form h2{font-size:30px}
    .form-options{flex-direction:column;gap:18px}
}













/* ---------- Genel util ------------------------------------------------ */
.container-xl{max-width:1180px;margin:0 auto;padding:0 1.5rem;}

/* ========== HERO ===================================================== */
.rt-hero{
  background:url('{{ asset('images/report-hero.jpg') }}') center/cover no-repeat;
  position:relative;padding:90px 0 100px;color:#fff;text-align:center;overflow:hidden;
}
.rt-hero::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.55);z-index:0;}
.hero-inner{position:relative;z-index:1;}
.hero-title{font-size:2.6rem;font-weight:700;margin-bottom:.4rem;}
.hero-sub{font-size:1.05rem;opacity:.9;}

.hero-wave{position:absolute;bottom:-40px;left:0;width:100%;height:auto;z-index:1;}

/* ========== KART Izgarası ============================================ */
.rt-listing{background:#fff;padding:3.5rem 0 5rem;}
.rt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.75rem;}

/* Kart  --------------------------------------------------------------- */
.rt-card{
  position:relative;height:220px;border-radius:1.25rem;overflow:hidden;
  color:#fff;text-decoration:none;
  transition:transform .35s ease,box-shadow .35s ease;
  box-shadow:0 6px 18px rgba(0,0,0,.06);
}
.rt-card:hover{transform:translateY(-8px) scale(1.03);box-shadow:0 12px 28px rgba(0,0,0,.12);}

.rt-bg{position:absolute;inset:0;background:linear-gradient(90deg, #7d0c17, #502727);
       transition:transform .7s ease;}
.rt-card:hover .rt-bg{transform:scale(1.08);}

/* ikonik daire -------------------------------------------------------- */
.rt-icon{
  position:absolute;top:14px;left:14px;width:44px;height:44px;background:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.15);z-index:2;
}
.rt-icon img{width:22px;height:22px;object-fit:contain;}

/* içerik -------------------------------------------------------------- */
.rt-content{
  position:absolute;bottom:0;left:0;right:0;padding:1.5rem 1.25rem 1.65rem;z-index:2;
  background:linear-gradient(to top,rgba(0,0,0,.55) 20%,rgba(0,0,0,0));
}
.rt-content h3{margin:0 0 .45rem;font-size:1.05rem;font-weight:600;line-height:1.3;}
.rt-content p{
  margin:0;font-size:.88rem;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}

/* ========== Responsive ============================================== */
@media(max-width:576px){
  .hero-title{font-size:2rem;}
  .rt-card{height:200px;}
  .rt-grid{gap:1.25rem;}
  .rt-icon{width:40px;height:40px;}
  .rt-icon img{width:20px;height:20px;}
}