.text-container { width:100vw; height:100vh; display:flex; align-items:center; justify-content:center; }
.text-container img { max-width:80%; height:auto; display:block; animation:float 4s ease-in-out infinite; pointer-events:none; -webkit-user-drag:none; user-select:none; }
@keyframes float { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-4px); } }
.shape { position:absolute; border-radius:50%; opacity:0.1; z-index:1; filter:blur(1px); }
.shape1 { width:180px; height:180px; background:#8f84e8; top:5%; left:8%; }
.shape2 { width:200px; height:90px; background:#ffe17d; border-radius:40% 60% 50% 50%; bottom:10%; right:20%; }
.shape3 { width:150px; height:150px; background:#55efc4; top:15%; right:30%; }
.shape4 { width:100px; height:100px; background:#ff7675; bottom:25%; left:30%; }
.word-container { display:flex; align-items:center; padding:10px 30px; justify-content:space-between; gap:60px; position:relative; padding-bottom:60px; }
.word-text-content { flex:1; text-align:left; background:rgba(255,255,255,0.05); border-radius:16px; box-shadow:0 4px 30px rgba(0,0,0,0.1); backdrop-filter:blur(1.7px); border:1px solid rgba(255,255,255,0.21); padding:10px; position:relative; z-index:2; transition:transform .2s ease, box-shadow .2s ease; }
.word-text-content:hover { transform:scale(1.003); box-shadow:0 4.2px 30px rgba(0,0,0,0.1); }
.background-shape { position:absolute; width:120px; height:120px; opacity:0.15; z-index:0; top:100px; left:450px; right:auto; }
.word-text-content h1 { font-size:2.8rem; margin-bottom:20px; color:#2c3e50; line-height:1.2; }
.word-altbaslik { font-size:1.4rem; margin-bottom:20px; color:#34495e; line-height:1.5; }
.word-text { font-size:1.1rem; margin-bottom:30px; color:#5a6c7d; line-height:1.6; }
.word-button { background:#b00000; color:white; border:none; padding:16px 32px; font-size:1.2rem; border-radius:12px; cursor:pointer; transition:all .3s ease; display:flex; align-items:center; gap:10px; box-shadow:0 4px 15px rgba(108,92,231,0.3); }
.word-button:hover { transform:translateY(-3px); box-shadow:0 6px 20px rgba(108,92,231,0.4); }
.image-content { flex:1; display:flex; justify-content:center; }
.image-content img { max-width:80%; animation:float 4s ease-in-out infinite; pointer-events:none; -webkit-user-drag:none; user-select:none; }

@media screen and (max-width:1200px) { .word-container { gap:40px; padding:10px 20px; } .word-text-content h1 { font-size:2.4rem; } .word-altbaslik { font-size:1.2rem; } .background-shape { display:none; } .word-container { padding:20px 20px 100px 20px; } }
@media screen and (max-width:992px) { .word-container { flex-direction:column; text-align:center; gap:40px; padding:40px 20px; } .word-text-content { text-align:center; max-width:90%; margin:0 auto; } .word-text-content h1 { font-size:2.2rem; } .background-shape { top:50px; left:50%; transform:translateX(-50%); } .image-content { display:none; } .word-button { margin:0 auto; display:flex; justify-content:center; } .word-container { padding-bottom:70px; } }
@media screen and (max-width:768px) { .text-container img { max-width:90%; } .shape1 { width:120px; height:120px; top:10%; left:5%; } .shape2 { width:150px; height:70px; bottom:15%; right:15%; } .shape3 { width:100px; height:100px; top:20%; right:20%; } .shape4 { width:80px; height:80px; bottom:30%; left:20%; } .word-text-content h1 { font-size:1.9rem; } .word-altbaslik { font-size:1.1rem; } .word-text { font-size:1rem; } .word-button { padding:14px 28px; font-size:1.1rem; margin:0 auto; justify-content:center; } }
@media screen and (max-width:576px) { .text-container { height:100vh; } .text-container img { max-width:95%; } .shape1,.shape2,.shape3,.shape4 { display:block; opacity:0.08; } .shape1 { width:80px; height:80px; top:15%; left:10%; } .shape2 { width:100px; height:50px; bottom:20%; right:15%; } .shape3 { width:70px; height:70px; top:25%; right:15%; } .shape4 { width:60px; height:60px; bottom:25%; left:15%; } .word-container { padding:0 15px 90px 15px; gap:30px; } .word-text-content { max-width:95%; padding:15px; } .word-text-content h1 { font-size:1.7rem; margin-bottom:15px; } .word-altbaslik { font-size:1rem; margin-bottom:15px; } .word-text { font-size:.95rem; margin-bottom:20px; } .word-button { padding:12px 24px; font-size:1rem; } }
@media screen and (max-width:400px) { .word-text-content h1 { font-size:1.5rem; } .word-altbaslik { font-size:.95rem; } .word-button { padding:10px 20px; font-size:.95rem; } .shape1 { width:60px; height:60px; } .shape2 { width:80px; height:40px; } .shape3 { width:50px; height:50px; } .shape4 { width:40px; height:40px; } }