:root{font-family:Inter,"Segoe UI",system-ui,sans-serif;color:#153451;--blue:#168cb4;--deep:#0e7496;--cyan:#15b8c8;--glass:rgba(255,255,255,.66);--line:rgba(20,133,169,.19);--muted:#5e7890}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(circle at 12% 9%,#fff 0,transparent 30%),radial-gradient(circle at 86% 20%,rgba(47,213,205,.25),transparent 27%),linear-gradient(145deg,#edfaff,#d8f4fb 52%,#effcf8);color:#153451}.page-shell{width:min(1180px,calc(100% - 28px));margin:28px auto}.glass{background:var(--glass);border:1px solid rgba(255,255,255,.95);box-shadow:0 24px 70px rgba(31,110,143,.14);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}.showcase{min-height:740px;border-radius:34px;padding:26px 34px 20px;overflow:hidden;position:relative}.topbar{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:5}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#1680a3}.brand-q,.footer-q{font-size:54px;line-height:.8;font-weight:950;letter-spacing:-.11em}.brand b{display:block;font-size:28px;letter-spacing:-.055em}.brand small{display:block;margin-top:5px;color:#486579;font-size:8px;letter-spacing:.18em}.top-actions{display:flex;gap:9px}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:12px;padding:11px 15px;font:inherit;font-size:12px;font-weight:850;text-decoration:none;cursor:pointer}.btn.primary{background:linear-gradient(120deg,#168db5,#0c718f);color:#fff;box-shadow:0 10px 23px rgba(15,121,157,.24)}.btn.ghost{background:rgba(255,255,255,.75);border:1px solid #fff;color:#176f8f}.hero-copy{text-align:center;max-width:760px;margin:12px auto 0;position:relative;z-index:3}.hero-copy h1{font-size:clamp(30px,4.4vw,55px);letter-spacing:-.055em;line-height:1.03;margin:0 0 8px}.hero-copy h1 em{font-family:Georgia,serif;font-weight:600;color:#1689ac}.hero-copy p{font-size:14px;line-height:1.6;color:var(--muted);margin:0 auto;max-width:680px}.hero-copy strong{color:#244f69}.phone-stage{position:relative;width:min(760px,100%);height:510px;margin:5px auto 0}.phone-stage:before{content:"";position:absolute;width:360px;height:360px;left:50%;top:51%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(20,184,200,.27),rgba(22,140,180,.11) 55%,transparent 70%)}.phone-crop{position:absolute;z-index:2;left:50%;top:8px;transform:translateX(-50%) rotate(-5deg);width:280px;height:485px;overflow:hidden;filter:drop-shadow(0 28px 22px rgba(24,71,95,.28));animation:float 5s ease-in-out infinite}.phone-crop img{position:absolute;height:490px;width:898px;max-width:none;left:50%;top:0;transform:translateX(-50%);object-fit:cover;mix-blend-mode:multiply}.feature{position:absolute;z-index:3;color:#137b9e;font-size:12px;font-weight:750;white-space:nowrap;animation:breathe 2.8s ease-in-out infinite}.feature:after{content:"";position:absolute;width:66px;height:32px;border-top:2px dashed #16a7b7}.feature:before{content:"";position:absolute;width:8px;height:8px;border-right:2px solid #16a7b7;border-bottom:2px solid #16a7b7}.f1{left:64px;top:70px}.f1:after{left:100%;top:14px;transform:rotate(18deg)}.f1:before{left:calc(100% + 58px);top:29px;transform:rotate(-30deg)}.f2{right:48px;top:75px}.f2:after{right:100%;top:14px;transform:rotate(-18deg)}.f2:before{right:calc(100% + 58px);top:29px;transform:rotate(120deg)}.f3{left:28px;top:190px}.f3:after{left:100%;top:13px}.f3:before{left:calc(100% + 58px);top:8px;transform:rotate(-45deg)}.f4{right:34px;top:190px}.f4:after{right:100%;top:13px}.f4:before{right:calc(100% + 58px);top:8px;transform:rotate(135deg)}.f5{left:40px;top:316px}.f5:after{left:100%;top:4px;transform:rotate(-17deg)}.f5:before{left:calc(100% + 58px);top:-13px;transform:rotate(-60deg)}.f6{right:45px;top:316px}.f6:after{right:100%;top:4px;transform:rotate(17deg)}.f6:before{right:calc(100% + 58px);top:-13px;transform:rotate(150deg)}.f7{left:85px;bottom:50px}.f7:after{left:100%;top:-4px;transform:rotate(-28deg)}.f7:before{left:calc(100% + 56px);top:-32px;transform:rotate(-65deg)}.f8{right:88px;bottom:50px}.f8:after{right:100%;top:-4px;transform:rotate(28deg)}.f8:before{right:calc(100% + 56px);top:-32px;transform:rotate(155deg)}.feature:nth-child(even){animation-delay:-1.4s}@keyframes float{50%{transform:translateX(-50%) translateY(-9px) rotate(-3deg)}}@keyframes breathe{50%{transform:translateY(-4px);opacity:.72}}.systems{margin-top:18px;border-radius:26px;padding:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.systems article{padding:17px;border-radius:19px;background:rgba(255,255,255,.62);border:1px solid #fff}.systems h2{font-size:16px;margin:0 0 10px;color:#147c9f}.systems a{display:inline-block;text-decoration:none;color:#5a7488;font-size:11px;font-weight:700;margin:4px 10px 4px 0}.systems a:hover{color:#0c8eae}.footer{margin-top:18px;border-radius:26px;padding:25px}.footer-info{display:grid;grid-template-columns:1fr .7fr 1.35fr;gap:30px}.footer-info>div:first-child{display:flex;gap:15px;align-items:flex-start}.footer-q{color:#1886a9}.footer h3{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:#147c9f;margin:0 0 9px}.footer p,.footer a{font-size:10px;line-height:1.65;color:#5f788c;margin:0;text-decoration:none}.footer-info>div:nth-child(2) a{display:block;margin:3px 0}.legal{display:flex;flex-wrap:wrap;gap:6px;margin-top:20px;padding-top:17px;border-top:1px solid var(--line)}.legal a{padding:6px 8px;border-radius:8px;background:rgba(255,255,255,.57);border:1px solid #fff;font-size:9px;font-weight:700}.copyright{text-align:center;color:#7890a1;font-size:9px;margin-top:15px}.welcome-popup{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:18px;background:rgba(12,61,80,.28);backdrop-filter:blur(12px);opacity:0;transition:.25s}.welcome-popup[hidden]{display:none}.welcome-popup.open{opacity:1}.welcome-card{width:min(460px,100%);border-radius:28px;padding:34px;text-align:center;position:relative;transform:translateY(14px);transition:.25s}.welcome-popup.open .welcome-card{transform:none}.welcome-close{position:absolute;right:14px;top:14px;width:35px;height:35px;border:1px solid #fff;border-radius:11px;background:rgba(255,255,255,.75);font-size:20px;color:#326278;cursor:pointer}.welcome-q{display:grid;place-items:center;width:56px;height:56px;border-radius:18px;margin:0 auto 12px;background:linear-gradient(140deg,#168db5,#16b9b2);color:#fff;font-size:28px;font-weight:950}.welcome-card small{font-size:9px;letter-spacing:.14em;color:#1683a5}.welcome-card h2{font-size:30px;letter-spacing:-.045em;margin:13px 0 8px}.welcome-card p{color:var(--muted);font-size:13px}.welcome-card>div{display:flex;justify-content:center;gap:9px;margin-top:20px}@media(max-width:760px){.page-shell{width:calc(100% - 16px);margin:8px auto}.showcase{padding:18px 14px;min-height:700px;border-radius:25px}.brand-q{font-size:43px}.brand b{font-size:21px}.top-actions .ghost{display:none}.hero-copy{margin-top:20px}.hero-copy h1{font-size:35px}.phone-stage{height:500px}.phone-crop{width:230px;height:440px;top:25px}.phone-crop img{height:445px;width:816px}.feature{font-size:9px}.feature:after,.feature:before{display:none}.f1{left:2px;top:90px}.f2{right:2px;top:90px}.f3{left:0;top:205px}.f4{right:0;top:205px}.f5{left:0;top:322px}.f6{right:0;top:322px}.f7{left:8px;bottom:35px}.f8{right:8px;bottom:35px}.systems{grid-template-columns:1fr 1fr;padding:12px}.footer-info{grid-template-columns:1fr}.footer-info>div:first-child{display:block}.welcome-card{padding:30px 20px}.welcome-card>div{flex-direction:column}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* Tek ekran: metin solda, tek telefon sağda */
@media(min-width:761px){
  .showcase{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(600px,1.28fr);grid-template-rows:auto 1fr;column-gap:14px;align-items:center}
  .topbar{grid-column:1/-1}
  .hero-copy{grid-column:1;text-align:left;max-width:430px;margin:0 0 0 20px}
  .hero-copy h1{font-size:clamp(40px,4.15vw,58px);line-height:1.02;margin-bottom:18px}
  .hero-copy p{font-size:15px;margin:0;max-width:420px}
  .phone-stage{grid-column:2;width:100%;height:590px;margin:0}
  .phone-crop{top:45px;width:295px;height:510px}
  .phone-crop img{height:515px;width:945px}
}
.hero-copy h1 em{font-family:inherit;font-style:normal;font-weight:900;color:#1689ac}

/* Kullanıcının sağladığı tek telefon mockup'ı */
.phone-crop{overflow:visible;transform:translateX(-50%);filter:drop-shadow(0 30px 25px rgba(24,71,95,.25))}
.phone-crop img{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:contain;transform:none;mix-blend-mode:normal}
@keyframes float{50%{transform:translateX(-50%) translateY(-9px)}}
@media(min-width:761px){.phone-crop{top:22px;width:310px;height:550px}.phone-crop img{width:100%;height:100%}}
@media(max-width:760px){.phone-crop{top:24px;width:245px;height:445px}.phone-crop img{width:100%;height:100%}}

/* Panel girişleriyle birleşik standart footer */
.footer{margin:24px calc(50% - 50vw) 0;padding:38px max(28px,calc((100vw - 1180px)/2));border-radius:0;background:rgba(236,250,253,.9);border-top:1px solid rgba(20,133,169,.2);box-shadow:0 -14px 42px rgba(31,110,143,.08)}
.systems{margin:0;padding:0 0 30px;border-radius:0;background:transparent;border:0;box-shadow:none;border-bottom:1px solid var(--line)}
.systems article{padding:0 22px 0 0;border-radius:0;background:transparent;border:0;border-right:1px solid var(--line)}
.systems article:last-child{border-right:0}
.footer-details{padding-top:28px}
.footer-info{align-items:start}
.legal{margin-top:25px}
@media(max-width:760px){.footer{margin-top:16px;padding:28px 20px}.systems{padding-bottom:22px;gap:22px 12px}.systems article{border-right:0;padding:0}.footer-details{padding-top:24px}}

/* Düzenli kavisli özellik okları */
.feature:before,.feature:after{display:none!important}
.feature-arrows{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;pointer-events:none}
.feature-arrows path{fill:none;stroke:#16a7b7;stroke-width:2;stroke-linecap:round;stroke-dasharray:7 7;marker-end:url(#arrow-tip);animation:arrowFlow 1.6s linear infinite}
.feature-arrows marker path{fill:#16a7b7;stroke:none;animation:none}
@keyframes arrowFlow{to{stroke-dashoffset:-28}}
.feature{padding:7px 10px;border-radius:11px;background:rgba(255,255,255,.68);border:1px solid rgba(255,255,255,.9);box-shadow:0 8px 20px rgba(34,111,140,.08);animation:labelFloat 3.2s ease-in-out infinite}
@keyframes labelFloat{50%{transform:translateY(-3px)}}
@media(max-width:760px){.feature-arrows{display:none}.feature{padding:5px 7px;background:rgba(255,255,255,.74)}}

/* Eski site düzenini temel alan responsive standart footer */
.standard-footer{width:100vw;margin:24px calc(50% - 50vw) 0;background:rgba(240,251,253,.94);border-top:1px solid rgba(20,133,169,.2);color:#395e74}
.footer-inner{width:min(1180px,calc(100% - 40px));margin:auto;padding:42px 0 24px}
.footer-columns{display:grid;grid-template-columns:1.25fr .72fr .72fr .92fr 1.35fr;gap:36px;align-items:start}
.footer-about{display:grid;grid-template-columns:54px 1fr;gap:15px;align-items:start}.footer-logo{color:#1886a9;font-size:62px;line-height:.75;font-weight:950;letter-spacing:-.12em}.footer-about p,.footer-column p{margin:0;color:#597486;font-size:11px;line-height:1.7}
.footer-column h2{margin:0 0 15px;color:#087ca4;font-size:11px;line-height:1;text-transform:uppercase;letter-spacing:.1em}.footer-column a{display:block;margin:0 0 10px;color:#496c81;font-size:11px;text-decoration:none}.footer-column a:hover{color:#0994b8}.footer-company strong{color:#244e66;font-size:12px}.footer-company p+p{margin-top:8px}.footer-rule{height:1px;background:rgba(20,133,169,.18);margin:25px 0 18px}.footer-bottom{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:start;color:#6d8797;font-size:9px}.footer-bottom>span{white-space:nowrap;padding-top:4px}.standard-footer .legal{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:5px 0;margin:0;padding:0;border:0}.standard-footer .legal a{position:relative;padding:3px 10px;background:none;border:0;border-radius:0;color:#6d7f91;font-size:9px;font-weight:500;text-decoration:none}.standard-footer .legal a+a:before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:1px;background:rgba(62,102,126,.32)}
@media(max-width:900px){.footer-columns{grid-template-columns:1.2fr 1fr 1fr;gap:30px}.footer-company{grid-column:2/4}.footer-bottom{grid-template-columns:1fr}.standard-footer .legal{justify-content:flex-start}.footer-bottom>span{white-space:normal}}
@media(max-width:760px){body{overflow-x:hidden}.showcase{min-height:auto;padding-bottom:18px}.topbar{gap:10px}.brand small{display:none}.hero-copy{text-align:center}.hero-copy p{font-size:13px}.phone-stage{height:470px;margin-top:6px}.feature,.feature-arrows{display:none!important}.phone-crop{top:8px;width:min(270px,74vw);height:450px}.footer-inner{width:min(100% - 32px,1180px);padding:34px 0 22px}.footer-columns{grid-template-columns:1fr 1fr;gap:28px 22px}.footer-about{grid-column:1/-1}.footer-company{grid-column:1/-1}.footer-rule{margin-top:28px}.footer-bottom{gap:14px}.standard-footer .legal{line-height:1.75}.standard-footer .legal a{padding:2px 8px 2px 0;margin-right:8px}.standard-footer .legal a+a:before{display:none}}
@media(max-width:430px){.page-shell{width:calc(100% - 12px);margin:6px auto}.showcase{padding:14px 10px;border-radius:22px}.brand{gap:7px}.brand-q{font-size:38px}.brand b{font-size:19px}.top-actions .primary{padding:9px 11px;font-size:10px}.hero-copy h1{font-size:31px;margin-top:15px}.phone-stage{height:420px}.phone-crop{width:230px;height:405px}.footer-columns{grid-template-columns:1fr}.footer-about,.footer-company{grid-column:auto}.footer-column h2{margin-bottom:11px}.footer-column a{margin-bottom:8px}.welcome-card h2{font-size:25px}}

/* Gerçek QSmart marka logosu */
.brand-logo{display:block;width:54px;height:54px;object-fit:contain;border-radius:14px}
.footer-logo{display:block;width:58px;height:58px;object-fit:contain;border-radius:15px;letter-spacing:normal}
.welcome-logo{display:block;width:70px;height:70px;object-fit:contain;border-radius:18px;margin:0 auto 12px;box-shadow:0 12px 28px rgba(201,55,116,.18)}
@media(max-width:430px){.brand-logo{width:42px;height:42px}.footer-logo{width:54px;height:54px}}

/* Üst menü: verilen tasarımdaki sade yazı logosu */
.brand-word{display:block;color:#167f9f;font-size:42px;line-height:.9;font-weight:850;letter-spacing:-.065em}
@media(max-width:430px){.brand-word{font-size:31px}}

/* Ok uçları çizgi üzerinde telefona doğru ilerler */
.feature-arrows .arrow-guide{fill:none;stroke:#16a7b7;stroke-width:2;stroke-linecap:round;stroke-dasharray:4 7;opacity:.55;animation:none;marker-end:none}
.feature-arrows .travel-arrow>path{fill:#05a9bc;stroke:none;filter:drop-shadow(0 2px 3px rgba(2,126,151,.3));animation:none;marker-end:none}

/* Mobilde hiçbir temel içerik veya giriş butonu kaybolmaz */
.feature-list{display:contents}
.footer-bottom{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.footer-bottom>span{width:100%;text-align:center;white-space:normal;padding:0}
.standard-footer .legal{width:100%;justify-content:center!important;align-items:center}
@media(max-width:760px){
  .topbar{align-items:center;gap:7px}
  .top-actions{display:flex;gap:5px;flex-shrink:0}
  .top-actions .ghost{display:inline-flex!important}
  .top-actions .btn{padding:8px 9px;font-size:9px;border-radius:10px;white-space:nowrap}
  .phone-stage{height:590px;margin-top:8px}
  .phone-crop{top:0;width:min(250px,68vw);height:410px}
  .feature-list{position:absolute;display:grid;grid-template-columns:1fr 1fr;gap:7px;left:8px;right:8px;bottom:10px;z-index:5}
  .feature-list .feature{position:static!important;display:flex!important;align-items:center;justify-content:center;min-height:34px;padding:6px 8px;text-align:center;white-space:normal;font-size:9px;line-height:1.25;animation:none}
  .feature-arrows{display:none!important}
  .standard-footer .legal{justify-content:center!important;gap:5px 0;line-height:1.5}
  .standard-footer .legal a{padding:4px 7px;margin:0;text-align:center}
}
@media(max-width:430px){
  .brand-word{font-size:27px}
  .top-actions .btn{padding:8px 7px;font-size:8px}
  .hero-copy h1{font-size:29px}
  .phone-stage{height:570px}
  .phone-crop{width:225px;height:390px}
  .footer-columns{grid-template-columns:1fr 1fr}
  .footer-about,.footer-company{grid-column:1/-1}
}
@media(max-width:350px){
  .topbar{flex-wrap:wrap}
  .top-actions{width:100%}.top-actions .btn{flex:1}
  .footer-columns{grid-template-columns:1fr}.footer-about,.footer-company{grid-column:auto}
}

/* Kaynak PNG'nin beyaz zeminini açık tema ile görsel olarak birleştir */
.footer-logo,.welcome-logo{background:transparent;mix-blend-mode:multiply;clip-path:inset(1.2% 0 0 0 round 15px)}

/* Mobil footer: tek, düzenli ve ortalanmış sütun */
@media(max-width:760px){
  .footer-inner{width:min(100% - 36px,1180px);padding:32px 0 22px}
  .footer-columns{display:grid;grid-template-columns:1fr!important;gap:25px;text-align:center}
  .footer-about,.footer-company{grid-column:1!important}
  .footer-about{display:flex;flex-direction:column;align-items:center;gap:12px}
  .footer-column h2{margin-bottom:12px}
  .footer-column a{margin:0 0 9px}
  .footer-company p{max-width:330px;margin-left:auto;margin-right:auto}
  .footer-rule{margin:26px 0 17px}
  .footer-bottom{align-items:center;text-align:center}
  .standard-footer .legal{justify-content:center!important;max-width:380px;margin-left:auto;margin-right:auto}
}

/* Gerçek alfa kanallı logo: popup ve footer */
.footer-logo,.welcome-logo{mix-blend-mode:normal!important;clip-path:none!important;background:transparent!important;border-radius:0!important}
.welcome-logo{width:82px;height:82px;box-shadow:none!important}
