/* saffet.css */
:root{--bg-dark:#02040a;--nav-bg:rgba(2,4,10,.7);--nav-scrolled:rgba(2,4,10,.95);--primary:#a855f7;--secondary:#06b6d4;--accent-green:#10b981;--accent-pink:#f43f5e;--text-main:#f8fafc;--text-muted:#94a3b8;--border-color:rgba(168,85,247,.15);--border-hover:rgba(6,182,212,.6);--badge-bg:rgba(6,182,212,.1);--btn-sec-bg:rgba(255,255,255,.03);--btn-sec-border:rgba(255,255,255,.1);--gradient-1:linear-gradient(135deg,var(--primary),#6366f1 50%,var(--secondary));--gradient-2:linear-gradient(135deg,var(--secondary),var(--accent-green));--gradient-pink:linear-gradient(135deg,var(--accent-pink),var(--primary));--project-gradient-1:linear-gradient(45deg,#2e1065,#3b0764);--particle-opacity:.25;--glow-color:rgba(6,182,212,.15);--timeline-line:#1e1b4b;--marquee-opacity:.3;--card-gradient:linear-gradient(135deg,rgba(15,23,42,.7),rgba(88,28,135,.15) 50%,rgba(6,182,212,.08));--marquee-bg-gradient:linear-gradient(90deg,transparent,rgba(15,23,42,.8),transparent);--font-code:'Plus Jakarta Sans',sans-serif}
[data-theme=light]{--bg-dark:#f5f7fc;--nav-bg:rgba(255,255,255,.95);--nav-scrolled:rgba(255,255,255,.98);--primary:#e84545;--secondary:#2a9d8f;--accent-green:#059669;--accent-pink:#e11d48;--text-main:#1a1a2e;--text-muted:#4a5568;--border-color:rgba(233,69,69,.15);--border-hover:rgba(42,157,143,.6);--badge-bg:rgba(42,157,143,.08);--btn-sec-bg:#f1f5f9;--btn-sec-border:rgba(0,0,0,.06);--project-gradient-1:linear-gradient(45deg,#f5f3ff,#ede9fe);--particle-opacity:.5;--glow-color:rgba(42,157,143,.08);--timeline-line:#e2e8f0;--marquee-opacity:.8;--card-gradient:linear-gradient(135deg,rgba(255,255,255,.95),rgba(245,247,252,.8));--marquee-bg-gradient:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent)}
[data-theme=matrix]{--bg-dark:#0a0f0f;--nav-bg:rgba(10,15,15,.85);--nav-scrolled:#0a0f0f;--primary:#00ff99;--secondary:#33ffcc;--accent-green:#00ff99;--accent-pink:#ff3366;--text-main:#ccffdd;--text-muted:#88aa99;--border-color:rgba(0,255,153,.2);--border-hover:#00ff99;--badge-bg:rgba(0,255,153,.1);--btn-sec-bg:rgba(0,255,153,.05);--btn-sec-border:rgba(0,255,153,.3);--project-gradient-1:linear-gradient(45deg,#001a10,#003322);--particle-opacity:.6;--glow-color:rgba(0,255,153,.2);--timeline-line:#1a332a;--marquee-opacity:.5;--card-gradient:linear-gradient(135deg,rgba(0,20,15,.8),rgba(0,51,34,.4));--font-code:'Fira Code',monospace}
*{margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth}html{width:100%;max-width:100%;overflow-x:hidden}body{width:100%;max-width:100%;background:var(--bg-dark);color:var(--text-main);overflow-x:hidden;transition:.3s;font-family:'Plus Jakarta Sans',sans-serif}[data-theme=matrix] body,[data-theme=matrix] .logo,[data-theme=matrix] #typing-text,[data-theme=matrix] .counter-item h3{font-family:var(--font-code)}.custom-cursor{width:8px;height:8px;background:var(--secondary);border-radius:50%;position:fixed;transform:translate(-50%,-50%);pointer-events:none;z-index:10000}.custom-cursor-outline{width:35px;height:35px;border:2px solid var(--primary);border-radius:50%;position:fixed;transform:translate(-50%,-50%);pointer-events:none;z-index:9999;transition:.15s;opacity:.6}.hovered-cursor{width:60px!important;height:60px!important;background:rgba(78,205,196,.1)!important;border-color:var(--secondary)!important;opacity:1}#particles-js{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:var(--particle-opacity)}.content-wrapper{position:relative;z-index:2;width:100%;max-width:100%;overflow:hidden}.theme-floating-btn{position:fixed;bottom:25px;right:25px;width:55px;height:55px;border-radius:50%;background:var(--gradient-1);color:#fff;border:0;font-size:1.4rem;box-shadow:0 10px 25px rgba(0,0,0,.3);z-index:9998;cursor:pointer;transition:.3s}.theme-floating-btn:hover{transform:scale(1.1) rotate(15deg)}
nav{position:fixed;top:0;left:0;width:100%;padding:1.2rem 8%;display:flex;justify-content:space-between;align-items:center;background:var(--nav-bg);backdrop-filter:blur(20px);z-index:1000;border-bottom:1px solid var(--border-color);transition:.3s}nav.scrolled{padding:.8rem 8%;background:var(--nav-scrolled)}.logo{font-size:1.6rem;font-weight:800;background:var(--gradient-1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:0;text-decoration:none}.nav-links{display:flex;list-style:none;gap:2.5rem}.nav-links a{color:var(--text-muted);text-decoration:none;font-weight:600;font-size:.95rem;position:relative;transition:.3s}.nav-links a:after{content:'';position:absolute;width:0;height:2px;bottom:-5px;left:0;background:var(--gradient-1);transition:.3s}.nav-links a:hover:after,.nav-links a.active:after{width:100%}.nav-links a:hover,.nav-links a.active{color:var(--text-main)}.menu-btn{display:none;background:none;border:0;color:var(--text-main);font-size:1.8rem;cursor:pointer}
section{padding:8rem 8% 5rem;min-height:100vh;display:flex;flex-direction:column;justify-content:center}.section-header{text-align:center;margin-bottom:3rem}.section-title{font-size:clamp(2rem,5vw,3rem);font-weight:800;letter-spacing:0}.section-title span,#typing-text,.hero-content h1 span,.counter-item h3{background:var(--gradient-1);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.section-subtitle{color:var(--text-muted);margin-top:.5rem}#anasayfa{display:flex;align-items:center;justify-content:space-between;gap:3rem;flex-direction:row}.hero-content{flex:1.2}.badge{display:inline-flex;align-items:center;gap:.5rem;background:var(--badge-bg);padding:.5rem 1.2rem;border-radius:50px;color:var(--secondary);font-size:.85rem;font-weight:700;margin-bottom:1.5rem;border:1px solid var(--border-hover)}.hero-content h1{font-size:clamp(2.6rem,7vw,4rem);font-weight:800;line-height:1.1;margin-bottom:1.2rem;letter-spacing:0}#typing-text{display:inline-block;min-width:min(430px,100%)}.hero-content p{color:var(--text-muted);font-size:1.1rem;margin-bottom:2rem;max-width:550px;line-height:1.7}.btn-group{display:flex;flex-wrap:wrap;gap:.8rem}.btn{padding:.9rem 2rem;border-radius:12px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:.3s;border:0;cursor:pointer}.btn-primary{background:var(--gradient-pink);color:#fff;box-shadow:0 10px 25px rgba(244,63,94,.3)}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 15px 30px rgba(244,63,94,.5)}.btn-secondary{background:var(--btn-sec-bg);color:var(--text-main);border:1px solid var(--btn-sec-border)}.hero-stats{display:flex;gap:2.5rem;margin-top:2.5rem;flex-wrap:wrap}.counter-item h3{font-size:2.5rem;font-weight:800}.counter-item p{color:var(--text-muted);font-size:.85rem}.hero-image-container{flex:.8;display:flex;justify-content:center}.glass-profile{width:350px;height:350px;border-radius:30% 70% 70% 30%/30% 30% 70% 70%;background-position:center;background-size:cover;box-shadow:0 20px 40px rgba(168,85,247,.2);border:4px solid var(--border-color);animation:morphing 10s infinite ease-in-out}@keyframes morphing{0%,100%{border-radius:30% 70% 70% 30%/30% 30% 70% 70%}50%{border-radius:70% 30% 30% 70%/70% 70% 30% 30%}}
.marquee-container{width:100%;overflow:hidden;background:var(--marquee-bg-gradient);backdrop-filter:blur(5px);padding:2rem 0;border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color);margin:2rem 0}.marquee-content{display:flex;gap:4rem;width:max-content;animation:marquee 25s linear infinite;opacity:var(--marquee-opacity)}.marquee-content i{font-size:2rem;background:var(--gradient-1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:flex;align-items:center;gap:.8rem;font-style:normal;font-weight:800}@keyframes marquee{to{transform:translateX(-50%)}}
.services-grid,.skills-grid,.projects-grid,.blog-grid,.process-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:2rem}.service-card,.skill-card,.project-card,.blog-card,.process-card{background:var(--card-gradient);backdrop-filter:blur(10px);border:1px solid var(--border-color);border-radius:24px;transition:.3s;overflow:hidden}.service-card,.skill-card,.process-card{padding:2.5rem}.service-card,.process-card{text-align:center}.service-card:hover,.skill-card:hover,.blog-card:hover,.process-card:hover{transform:translateY(-8px);border-color:var(--secondary);box-shadow:0 10px 30px rgba(6,182,212,.15)}.service-icon,.skill-icon{width:70px;height:70px;background:rgba(78,205,196,.1);border-radius:20px;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;color:var(--secondary);font-size:2rem}.skill-icon{margin:0 0 1.5rem}.service-card h3,.skill-card h3,.project-body h3,.blog-content h3{margin-bottom:.8rem;font-size:1.3rem}.service-card p,.skill-card p,.project-body p,.blog-content p,.process-card p{color:var(--text-muted);font-size:.9rem;line-height:1.6}.skill-card{position:relative}.skill-card:before{content:'';position:absolute;inset:0;background:radial-gradient(800px circle at var(--x,0) var(--y,0),var(--glow-color),transparent 40%);z-index:3;pointer-events:none}
.filter-buttons{display:flex;gap:1rem;margin-bottom:2.5rem;flex-wrap:wrap;justify-content:center}.filter-btn{background:var(--btn-sec-bg);border:1px solid var(--btn-sec-border);color:var(--text-muted);padding:.6rem 1.5rem;border-radius:30px;font-weight:600;transition:.3s;cursor:pointer}.filter-btn.active,.filter-btn:hover{background:var(--gradient-1);color:#fff;border-color:transparent}.project-card:hover{transform:translateY(-5px) scale(1.02);border-color:var(--border-hover)}.project-banner{height:220px;background:var(--project-gradient-1);display:flex;align-items:center;justify-content:center;font-size:4rem;color:rgba(255,255,255,.22);position:relative}.project-tags{position:absolute;bottom:1rem;left:1.5rem;display:flex;gap:.5rem;flex-wrap:wrap}.tag{background:var(--bg-dark);color:var(--secondary);padding:.3rem .8rem;border-radius:6px;font-size:.75rem;font-weight:600;border:1px solid var(--border-color)}.project-body,.blog-content{padding:1.5rem}.blog-img{height:200px;background:var(--gradient-2);display:flex;align-items:center;justify-content:center;font-size:3rem}.blog-date,.read-more{font-size:.85rem;color:var(--secondary);display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;font-weight:600}.blog-date{font-size:.75rem;margin-bottom:.5rem}
.about-wrapper,.contact-wrapper-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:4rem;align-items:start}.about-story h3{font-size:2rem;margin-bottom:1.5rem;color:var(--secondary)}.about-story h4{margin-top:2rem;margin-bottom:1rem}.about-story p{color:var(--text-muted);font-size:1rem;line-height:1.7;margin-bottom:1.2rem}.process-card{position:relative}.process-step{position:absolute;top:-15px;left:50%;transform:translateX(-50%);width:35px;height:35px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;background:var(--gradient-1)}.timeline{position:relative;border-left:2px solid var(--timeline-line);padding-left:2rem;margin-left:1rem}.timeline-item{position:relative;margin-bottom:2rem}.timeline-item:before{content:'';position:absolute;left:calc(-2rem - 7px);top:5px;width:12px;height:12px;border-radius:50%;background:var(--primary);border:3px solid var(--bg-dark)}.timeline-date{font-size:.8rem;font-weight:700;color:var(--accent-pink);text-transform:uppercase;margin-bottom:.3rem}.timeline-title{font-size:1.1rem;margin-bottom:.3rem}.timeline-desc{color:var(--text-muted);font-size:.85rem;line-height:1.6}.info-box{background:var(--gradient-pink);color:#fff;padding:2.5rem;border-radius:30px;box-shadow:0 15px 30px rgba(244,63,94,.2)}.info-box h3{font-size:1.6rem;font-weight:800;margin-bottom:1rem}.c-details{margin-top:2rem}.c-item{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.c-item i{font-size:1.2rem;background:rgba(255,255,255,.15);padding:.8rem;border-radius:12px}.interactive-form{display:flex;flex-direction:column;gap:1rem}.interactive-form input,.interactive-form textarea{width:100%;background:var(--card-gradient);backdrop-filter:blur(10px);border:2px solid var(--border-color);padding:1rem;border-radius:14px;color:var(--text-main);font-size:1rem;transition:.3s;font:inherit}.interactive-form input:focus,.interactive-form textarea:focus{outline:none;border-color:var(--secondary);box-shadow:0 0 15px rgba(6,182,212,.2)}footer{text-align:center;padding:2rem;border-top:1px solid var(--border-color);color:var(--text-muted);font-size:.8rem}footer small{display:block;margin-top:.5rem;opacity:.65}
@media(max-width:992px){#anasayfa{flex-direction:column-reverse;text-align:center}.hero-content p{margin:0 auto 2rem}.hero-stats,.btn-group{justify-content:center}.glass-profile{width:240px;height:240px}.about-wrapper,.contact-wrapper-grid{grid-template-columns:1fr;gap:2rem}}@media(max-width:768px){.menu-btn{display:block}.nav-links{position:fixed;top:0;right:-100%;width:min(78%,340px);height:100vh;background:var(--nav-scrolled);backdrop-filter:blur(30px);flex-direction:column;justify-content:center;align-items:center;gap:2rem;transition:.3s;z-index:1000}.nav-links.active{right:0}}@media(max-width:1024px){.custom-cursor,.custom-cursor-outline{display:none}*{cursor:auto!important}section{padding:6rem 5% 4rem}}

/* Hero typing sabitleme: yazilar degisirken sayfa kaymasin. */
.hero-content h1{font-size:clamp(2.15rem,5.6vw,3.35rem);line-height:1.14;min-height:2.35em}
#typing-text{display:inline-block;width:22ch;max-width:100%;white-space:nowrap;vertical-align:bottom}
@media(max-width:992px){.hero-content h1{min-height:2.7em}#typing-text{display:block;width:100%;white-space:normal}}

/* Kalabalik alanlari ikili ve daha kompakt goster. */
.services-grid,.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}
.service-card,.skill-card{padding:1.65rem;text-align:left}
.service-icon,.skill-icon{width:52px;height:52px;border-radius:15px;font-size:1.45rem;margin:0 0 1rem}
.service-card h3,.skill-card h3{font-size:1.08rem;margin-bottom:.55rem}
.service-card p,.skill-card p{font-size:.84rem;line-height:1.55}
.marquee-container{padding:1.25rem 0}
.marquee-content{gap:2.35rem}
.marquee-content i{font-size:1.35rem}
@media(max-width:768px){.services-grid,.skills-grid{grid-template-columns:1fr}.service-card,.skill-card{padding:1.35rem}}
.process-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}
.process-card{padding:1.55rem;text-align:left}
.process-card h3{font-size:1.05rem;margin:.65rem 0 .35rem}
.process-card p{font-size:.84rem;line-height:1.5}
.process-step{left:1.55rem;top:-14px;transform:none}
@media(max-width:768px){.process-grid{grid-template-columns:1fr}.process-card{padding:1.35rem}}
.security-row{display:grid;grid-template-columns:120px 1fr;gap:1rem;align-items:center}
.security-code{display:flex;align-items:center;justify-content:center;min-height:52px;border:2px solid var(--border-hover);border-radius:14px;background:var(--badge-bg);color:var(--secondary);font-weight:800;font-size:1.25rem;letter-spacing:2px;font-family:var(--font-code)}
.form-note{color:var(--text-muted);font-size:.82rem;min-height:1.2em}
.btn.is-disabled,.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
@media(max-width:520px){.security-row{grid-template-columns:1fr}.security-code{justify-content:flex-start;padding:0 1rem}}

/* Proje domainleri masaustunde net okunsun. */
.projects-grid{grid-template-columns:repeat(auto-fit,minmax(360px,1fr))}
.project-body h3{font-size:1.15rem;line-height:1.25;word-break:break-word;overflow-wrap:anywhere;color:var(--text-main)}
.project-body .read-more{margin-top:1rem;padding:.55rem .8rem;border:1px solid var(--border-color);border-radius:10px;background:var(--btn-sec-bg)}
.project-body .read-more:hover{border-color:var(--secondary)}
@media(max-width:520px){.projects-grid{grid-template-columns:1fr}}
.project-banner.has-preview{height:300px;background:#07111f;align-items:flex-start;overflow:hidden}
.project-banner.has-preview img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform .45s ease}
.project-card:hover .project-banner.has-preview img{transform:scale(1.04)}
.project-banner.has-preview:after{content:'';position:absolute;inset:auto 0 0;height:42%;background:linear-gradient(180deg,transparent,rgba(2,4,10,.82));pointer-events:none}
.project-banner.has-preview .project-tags{z-index:2}
.footer-categories{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin:.8rem 0}
.footer-categories a{color:var(--secondary);text-decoration:none;border:1px solid var(--border-color);border-radius:999px;padding:.35rem .75rem;background:var(--btn-sec-bg)}
.footer-categories a:hover{border-color:var(--secondary)}

/* Logo: duvar badge / tabela hissi */
.logo{
  -webkit-text-fill-color:initial;
  background:
    linear-gradient(90deg,rgba(2,4,10,.22),rgba(2,4,10,.08)),
    url('../img/tugla-logo.svg') center/cover,
    linear-gradient(135deg,rgba(168,85,247,.28),rgba(6,182,212,.16));
  color:#f8fafc;
  border:1px solid rgba(255,255,255,.28);
  border-radius:8px;
  padding:.58rem 1rem;
  box-shadow:inset 0 0 18px rgba(255,255,255,.06),0 0 24px rgba(6,182,212,.18),0 8px 18px rgba(0,0,0,.24);
  text-shadow:0 2px 0 rgba(0,0,0,.65),0 0 8px var(--secondary),0 0 18px rgba(6,182,212,.55);
  letter-spacing:.04em;
  position:relative;
  transform:skewX(-4deg) rotate(-.4deg);
  isolation:isolate;
  clip-path:polygon(3% 9%,96% 2%,99% 28%,96% 95%,6% 100%,0 73%,2% 42%);
}
.logo:before{
  content:'';
  position:absolute;
  inset:5px;
  border:1px dashed rgba(255,255,255,.16);
  border-radius:5px;
  clip-path:polygon(2% 8%,98% 0,100% 35%,97% 96%,4% 100%,0 72%,2% 44%);
  pointer-events:none;
  z-index:1;
}
.logo:after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:0;
  background:
    linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent),
    repeating-linear-gradient(135deg,rgba(255,255,255,.06) 0 1px,transparent 1px 7px);
  opacity:.22;
  pointer-events:none;
  mix-blend-mode:screen;
}

/* Mobil menu cekmecesi */
.mobile-menu-head{display:none}
.menu-backdrop{position:fixed;inset:0;background:rgba(2,4,10,.62);backdrop-filter:blur(4px);z-index:999;opacity:0;pointer-events:none;transition:opacity .25s ease}
.menu-backdrop.active{opacity:1;pointer-events:auto}
.menu-open{overflow:hidden}
@media(max-width:768px){
  nav{padding:.82rem 5%}
  .logo{font-size:1.25rem}
  .menu-btn{font-size:1.35rem;width:42px;height:42px;border:1px solid var(--border-color);border-radius:12px;background:var(--btn-sec-bg)}
  .nav-links{width:min(82%,330px);padding:.95rem .82rem;align-items:stretch;justify-content:flex-start;gap:.38rem;border-left:1px solid var(--border-color);box-shadow:-18px 0 44px rgba(0,0,0,.34)}
  .mobile-menu-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.65rem;padding:.25rem .1rem .75rem;border-bottom:1px solid var(--border-color)}
  .mobile-menu-head span{font-size:.98rem;font-weight:800;color:var(--text-main)}
  .menu-close-btn{width:38px;height:38px;border:1px solid var(--border-color);border-radius:11px;background:var(--btn-sec-bg);color:var(--text-main);font-size:1.05rem}
  .nav-links li:not(.mobile-menu-head){width:100%}
  .nav-links a{display:flex;width:100%;padding:.72rem .78rem;border-radius:12px;background:rgba(255,255,255,.025);border:1px solid transparent;font-size:.9rem;font-weight:700}
  .nav-links a:hover,.nav-links a.active{border-color:var(--border-color);background:var(--badge-bg)}
  .nav-links a:after{display:none}
}

.blog-detail{width:min(920px,100%);margin:0 auto;padding:2.4rem;background:var(--card-gradient);border:1px solid var(--border-color);border-radius:24px;box-shadow:0 20px 50px rgba(0,0,0,.12)}
.blog-detail .section-title{text-align:left;margin:.5rem 0 1.2rem;font-size:clamp(2rem,4vw,3.2rem)}
.blog-detail-body{display:grid;gap:1rem;color:var(--text-muted);font-size:1.05rem;line-height:1.8}
.blog-detail-body p{margin:0}
.blog-detail .read-more{margin-top:2rem}
@media(max-width:640px){.blog-detail{padding:1.4rem;border-radius:18px}.blog-detail-body{font-size:1rem}}
.about-highlight{margin:1.6rem 0 1.8rem;padding:1.4rem 1.5rem;border:1px solid var(--border-hover);border-radius:18px;background:var(--badge-bg)}
.about-story .about-inline-title{margin:0 0 .85rem;color:var(--primary);font-size:1.35rem;line-height:1.3}
.about-highlight p:last-child{margin-bottom:0}
.form-alert{padding:1rem 1.1rem;border-radius:14px;border:1px solid var(--border-color);font-weight:700;line-height:1.45}
.form-alert.hata{background:rgba(244,63,94,.12);border-color:rgba(244,63,94,.45);color:var(--accent-pink)}
.form-alert.basarili{background:rgba(16,185,129,.12);border-color:rgba(16,185,129,.45);color:var(--accent-green)}
.contact-panel{gap:.82rem;padding:1rem;border:1px solid var(--border-color);border-radius:18px;background:rgba(255,255,255,.025);backdrop-filter:blur(12px)}
.contact-field{display:grid;grid-template-columns:132px minmax(0,1fr);align-items:center;gap:.9rem;color:var(--text-main);font-size:.88rem;font-weight:700}
.contact-field>span{color:var(--text-muted);text-align:left;line-height:1.25}
.input-inside,.phone-field{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:stretch;width:100%;background:rgba(255,255,255,.035);border:1px solid var(--border-color);border-radius:12px;overflow:hidden;transition:.3s}
.input-inside>i,.phone-field>i{display:grid;place-items:center;color:var(--secondary);font-size:.95rem;background:var(--badge-bg);border-right:1px solid var(--border-color)}
.input-inside input,.input-inside textarea,.phone-field input{border:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important;padding:.78rem .95rem!important}
.input-inside:focus-within,.phone-field:focus-within{border-color:var(--secondary);box-shadow:0 0 15px rgba(6,182,212,.14)}
.textarea-inside{align-items:start}
.textarea-inside>i{min-height:42px}
.contact-field textarea{min-height:138px;max-height:220px;line-height:1.55;resize:vertical}
.phone-field{grid-template-columns:62px minmax(0,1fr)}
.phone-field strong{display:grid;place-items:center;color:var(--secondary);font-weight:800;border-right:1px solid var(--border-color);background:rgba(6,182,212,.08)}
.phone-help{grid-column:2;margin-top:-.45rem;color:var(--text-muted);font-size:.78rem;font-weight:500}
.contact-security{display:grid;grid-template-columns:132px 120px minmax(0,1fr);gap:.9rem;align-items:end}
.contact-security:before{content:''}
.contact-security .contact-field{grid-template-columns:132px minmax(0,1fr);gap:.9rem}
.contact-security .security-code{min-height:42px;border-width:1px;border-radius:12px;font-size:1rem}
#saffetSubmitBtn{align-self:flex-end;width:auto;padding:.72rem 1.15rem;border-radius:11px;font-size:.9rem;box-shadow:0 8px 18px rgba(244,63,94,.22)}
#saffetSubmitBtn i{font-size:.9rem}
.whatsapp-contact{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;width:100%;margin-top:1.1rem;padding:.95rem 1rem;border-radius:14px;background:#25d366;color:#062b15;text-decoration:none;font-weight:800;box-shadow:0 12px 24px rgba(37,211,102,.22);transition:.25s}
.whatsapp-contact i{font-size:1.25rem}
.whatsapp-contact:hover{transform:translateY(-2px);filter:saturate(1.08)}
.idea-orbit{--orbit-size:clamp(610px,45vw,720px);--cloud-radius:calc(var(--orbit-size) / 2 - 88px);position:relative;width:var(--orbit-size);height:var(--orbit-size);display:grid;place-items:center;isolation:isolate}
.idea-orbit::before{content:'';position:absolute;inset:30px;border:0;border-radius:50%;background:radial-gradient(circle,transparent 50%,rgba(6,182,212,.08) 51%,transparent 68%);box-shadow:inset 0 0 34px rgba(6,182,212,.08);z-index:1;pointer-events:none}
.idea-orbit::after{content:'';position:absolute;inset:84px;border:0;border-radius:50%;z-index:1;pointer-events:none}
.idea-orbit .glass-profile{position:relative;z-index:3;width:clamp(300px,23vw,350px);height:clamp(300px,23vw,350px)}
.idea-cloud{position:absolute;left:50%;top:50%;z-index:4;display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:.36rem .58rem;border:1px solid rgba(255,255,255,.46);border-radius:999px;background:var(--cloud-bg,rgba(255,255,255,.72));backdrop-filter:blur(12px);color:var(--cloud-color,var(--text-main));font-size:.66rem;font-weight:800;line-height:1;box-shadow:0 10px 20px rgba(6,182,212,.1);white-space:nowrap;transform:translate(-50%,-50%) rotate(var(--angle)) translateX(calc(var(--cloud-radius) + var(--ring-offset,0px))) rotate(calc(var(--angle) * -1));transform-origin:center;animation:ideaCloudSpace var(--float-time,12s) ease-in-out infinite;animation-delay:var(--delay,0s)}
@keyframes ideaCloudSpace{0%,100%{border-radius:999px;box-shadow:0 10px 20px rgba(6,182,212,.1);transform:translate(-50%,-50%) rotate(var(--angle)) translateX(calc(var(--cloud-radius) + var(--ring-offset,0px))) rotate(calc(var(--angle) * -1)) translate3d(0,0,0) scale(1)}28%{border-radius:58% 42% 52% 48%/48% 58% 42% 52%;box-shadow:0 15px 28px rgba(6,182,212,.16);transform:translate(-50%,-50%) rotate(var(--angle)) translateX(calc(var(--cloud-radius) + var(--ring-offset,0px))) rotate(calc(var(--angle) * -1)) translate3d(var(--float-x,12px),var(--float-y,-10px),0) scale(1.025)}62%{border-radius:44% 56% 48% 52%/56% 44% 54% 46%;box-shadow:0 12px 24px rgba(6,182,212,.13);transform:translate(-50%,-50%) rotate(var(--angle)) translateX(calc(var(--cloud-radius) + var(--ring-offset,0px))) rotate(calc(var(--angle) * -1)) translate3d(var(--float-x2,-10px),var(--float-y2,8px),0) scale(.992)}}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:1rem;width:min(1180px,100%);margin:0 auto}
.gallery-card{background:var(--card-gradient);border:1px solid var(--border-color);border-radius:16px;overflow:hidden;transition:.25s;min-width:0}
.gallery-card:hover{transform:translateY(-4px);border-color:var(--secondary);box-shadow:0 12px 24px rgba(6,182,212,.12)}
.gallery-open{width:100%;border:0;background:transparent;color:var(--text-main);display:grid;text-align:left;cursor:pointer;font:inherit;text-decoration:none}
.gallery-open img{width:100%;aspect-ratio:16/11;object-fit:cover;display:block}
.gallery-open>i{height:138px;display:grid;place-items:center;font-size:2.2rem;color:var(--secondary)}
.gallery-open span{padding:.9rem .95rem .45rem;font-weight:800;font-size:1.08rem;line-height:1.25;min-height:3.15rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-decoration:none}
.gallery-open small{display:inline-flex;align-items:center;width:max-content;max-width:calc(100% - 1.9rem);margin:0 .95rem .95rem;padding:.34rem .62rem;border-radius:999px;background:var(--badge-bg);border:1px solid var(--border-color);color:var(--secondary);font-size:.78rem;font-weight:800;text-decoration:none}
.gallery-items{display:none}
.saffet-lightbox{position:fixed;inset:0;z-index:20000;background:rgba(2,4,10,.88);backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;padding:5rem 1.2rem 3rem}
.saffet-lightbox.active{display:flex}
.saffet-lightbox img{max-width:min(920px,88vw);max-height:72vh;border-radius:14px;box-shadow:0 24px 80px rgba(0,0,0,.45);object-fit:contain}
.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.1);color:#fff;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;cursor:pointer}
.lightbox-close{top:22px;right:22px}.lightbox-prev{left:22px}.lightbox-next{right:22px}
.lightbox-title{position:absolute;left:1rem;right:1rem;bottom:1.1rem;color:#fff;text-align:center;font-weight:700}
.gallery-detail-section{padding-top:7rem}
.gallery-detail-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(150px,100%),1fr));gap:.8rem;width:min(980px,100%);margin:0 auto}
.gallery-thumb{border:1px solid var(--border-color);border-radius:12px;overflow:hidden;background:var(--card-gradient);padding:0;cursor:pointer;transition:.22s;min-width:0}
.gallery-thumb:hover{transform:translateY(-3px);border-color:var(--secondary);box-shadow:0 10px 20px rgba(6,182,212,.12)}
.gallery-thumb img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.gallery-back{margin:2rem auto 0}
@media(max-width:640px){.contact-field,.contact-security .contact-field{grid-template-columns:1fr;gap:.45rem}.phone-help{grid-column:1}.contact-security{grid-template-columns:1fr}.contact-security:before{display:none}.contact-security .security-code{justify-content:center}}
@media(max-width:640px){#saffetSubmitBtn{align-self:flex-start;padding:.68rem 1rem;font-size:.86rem}}
@media(max-width:640px){.saffet-lightbox{padding:4.5rem .8rem 3rem}.lightbox-prev{left:8px}.lightbox-next{right:8px}.lightbox-close{right:12px;top:12px}}
@media(max-width:992px){.idea-orbit{width:100%;height:auto;min-height:auto;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:.55rem;padding-bottom:.4rem}.idea-orbit::before{display:none}.idea-orbit .glass-profile{flex:0 0 240px;width:240px;height:240px;order:1}.idea-cloud{position:static;transform:none;animation:none;font-size:.76rem;padding:.45rem .75rem;order:2;max-width:none}.idea-orbit .glass-profile{order:1}}

/* Hero alani daha dengeli: metin sakin, fikir halkasi kirpilmadan gorunur. */
@media(min-width:993px){
    #anasayfa{gap:1.4rem;padding-right:5%;overflow:visible}
    .hero-content{flex:0 1 47%;max-width:560px}
    .hero-content .badge{font-size:.78rem;padding:.42rem .95rem;margin-bottom:1rem}
    .hero-content h1{font-size:clamp(1.95rem,3.55vw,2.82rem);line-height:1.16;min-height:2.4em;margin-bottom:.9rem}
    #typing-text{width:24ch;min-width:24ch}
    .hero-content p{font-size:.98rem;line-height:1.62;max-width:500px;margin-bottom:1.35rem}
    .hero-stats{gap:1.55rem;margin-top:1.6rem}
    .counter-item h3{font-size:2.05rem}
    .hero-image-container{flex:0 0 50%;justify-content:center;transform:none;overflow:visible}
    .idea-orbit{--orbit-size:clamp(470px,36vw,540px);--cloud-radius:calc(var(--orbit-size) / 2 - 118px)}
    .idea-orbit .glass-profile{width:clamp(250px,18vw,300px);height:clamp(250px,18vw,300px)}
    .idea-cloud{font-size:.72rem;padding:.38rem .6rem;min-height:29px;animation:ideaCloudSpace var(--float-time,12s) ease-in-out infinite;animation-delay:var(--delay,0s)}
    .idea-orbit::before,.idea-orbit::after{animation:none}
}

/* Mobil yatay tasma kilidi: uzun metinler ve animasyonlar ekran disina genislik yazmasin. */
img,video,canvas,svg{max-width:100%;height:auto}
section,nav,footer,.content-wrapper,.hero-content,.hero-image-container,.about-wrapper,.contact-wrapper-grid,.services-grid,.skills-grid,.projects-grid,.blog-grid,.gallery-grid,.process-grid{max-width:100%;min-width:0}
.project-card,.blog-card,.service-card,.skill-card,.gallery-card,.process-card,.info-box,.contact-panel,.c-item,.c-item div,.project-body,.blog-content,.about-story,.timeline{min-width:0}
.c-item strong,.project-body h3,.blog-content h3,.about-story p,.timeline-desc,.gallery-open span{overflow-wrap:anywhere;word-break:normal}
@media(max-width:768px){
    html,body{overflow-x:hidden}
    .content-wrapper{overflow:hidden}
    section{width:100%;max-width:100%;padding-left:5%;padding-right:5%}
    #anasayfa{gap:1.1rem;overflow:hidden}
    .hero-content{width:100%;max-width:100%}
    .hero-image-container{width:100%;max-width:100%;overflow:hidden}
    .idea-orbit{max-width:100%;overflow:hidden}
    .idea-cloud{white-space:normal;text-align:center;max-width:calc(50vw - 18px);line-height:1.15}
    .marquee-container{max-width:100%;overflow:hidden}
    .marquee-content{max-width:none}
    .filter-buttons{max-width:100%;overflow:hidden}
    .filter-btn{max-width:100%;white-space:normal}
    .info-box{padding:1.45rem;border-radius:20px}
    .c-item{align-items:flex-start}
    .c-item strong{display:block;max-width:100%}
    .theme-floating-btn{right:14px;bottom:14px;width:48px;height:48px}
}

/* Mobilde fikir bulutlari da hareket etsin; ama ekran disina genislik tasirmasin. */
@media(max-width:992px){
    .idea-orbit{
        --orbit-size:min(94vw,390px);
        --cloud-radius:calc(var(--orbit-size) / 2 - 78px);
        position:relative;
        width:var(--orbit-size);
        height:var(--orbit-size);
        min-height:var(--orbit-size);
        display:grid;
        place-items:center;
        flex-wrap:initial;
        gap:0;
        margin:0 auto;
        padding:0;
        overflow:hidden;
    }
    .idea-orbit::before{
        display:block;
        inset:24px;
        background:radial-gradient(circle,transparent 52%,rgba(6,182,212,.08) 53%,transparent 69%);
    }
    .idea-orbit .glass-profile{
        position:relative;
        z-index:3;
        flex:initial;
        order:initial;
        width:clamp(178px,50vw,230px);
        height:clamp(178px,50vw,230px);
    }
    .idea-cloud{
        position:absolute;
        left:50%;
        top:50%;
        z-index:4;
        order:initial;
        max-width:118px;
        min-height:24px;
        padding:.32rem .5rem;
        font-size:.58rem;
        line-height:1.08;
        white-space:normal;
        text-align:center;
        transform:translate(-50%,-50%) rotate(var(--angle)) translateX(calc(var(--cloud-radius) + min(var(--ring-offset,0px), 14px))) rotate(calc(var(--angle) * -1));
        animation:ideaCloudSpace var(--float-time,12s) ease-in-out infinite;
        animation-delay:var(--delay,0s);
    }
}
@media(max-width:420px){
    .idea-orbit{
        --orbit-size:min(94vw,350px);
        --cloud-radius:calc(var(--orbit-size) / 2 - 72px);
    }
    .idea-orbit .glass-profile{
        width:172px;
        height:172px;
    }
    .idea-cloud{
        max-width:102px;
        font-size:.54rem;
        padding:.28rem .44rem;
    }
}

