/* K-35 Hepsi Tek Yerde: Views/Shared/_HepsiTekYerde.cshtml, js/hepsi-tek-yerde.js. <1240 px: one column; >=1240 px: 1360x840 scene scaled by --sc. Icons: sprite cell i = background-position-y i/12. */
.hty,.hty *,.hty *::before,.hty *::after{box-sizing:border-box}
.hty{--sc:1;background:linear-gradient(#fff,#F4F9FB);padding:56px 16px 48px;color:#404446}
.hty .hty-wrap{max-width:1360px;margin:0 auto;position:relative}
.hty .hty-wrap>h2{margin:0 0 8px;text-align:center;font-size:clamp(34px,4.4vw,52px);line-height:1.1;font-weight:800;color:#17479E;letter-spacing:-.02em}
.hty .hty-sub{margin:0 auto 36px;max-width:760px;text-align:center;font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:#404446}
.hty-scene{position:relative;max-width:760px;margin:0 auto}
.hty-scene::before{content:"";position:absolute;left:14px;right:50%;top:55px;height:2px;background:rgba(34,182,205,.4)}
.hty-hub{position:relative;z-index:2;width:112px;height:112px;margin:0 auto;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 0 0 2px rgba(34,182,205,.5),0 10px 28px rgba(23,71,158,.14)}
.hty-hub::before,.hty-hub::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.hty-hub::before{inset:-12px;border:2px solid rgba(34,182,205,.28)}
.hty-hub::after{inset:-26px;border:2px solid rgba(23,71,158,.12)}
.hty-hub img{width:58%;height:auto;display:block}
.hty-ring{position:absolute;inset:0;border-radius:50%;border:3px solid #22B6CD;opacity:0;pointer-events:none}
.hty .hty-l{list-style:none;margin:34px 0 0;padding:0;position:relative}
.hty-l::before{content:"";position:absolute;left:14px;top:-90px;bottom:46px;width:2px;background:rgba(34,182,205,.4)}
.hty-l>li{position:relative;margin:0 0 12px;padding:0 0 0 44px;background:radial-gradient(circle at 15px 50%,#fff 0 3px,#22B6CD 3.5px 6.5px,transparent 7px)}
.hty-l>li.more{margin:0;background-image:radial-gradient(circle at 15px 50%,#fff 0 3px,#ED243F 3.5px 6.5px,transparent 7px)}
.hty-card{text-align:left;position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-content:center;column-gap:12px;min-height:92px;padding:12px 14px;border-radius:18px;background:#fff;border:1px solid #D9E5EC;box-shadow:0 1px 2px rgba(23,71,158,.06),0 8px 22px rgba(23,71,158,.07);color:inherit;text-decoration:none;transition:border-color .2s,box-shadow .2s}
a.hty-card:hover{border-color:#22B6CD;outline:3px solid #22B6CD;outline-offset:2px}
a.hty-card:focus-visible{outline:3px solid #22B6CD;outline-offset:3px}
.hty-card::before{content:"";grid-row:1/span 2;align-self:center;width:56px;height:56px;border-radius:16px;background:#E6F6F9 url(/web/images/hepsi-tek-yerde-ikon.svg) no-repeat 0 0/100% 1300%}
.hty .hty-card h3{grid-column:2;align-self:end;margin:0 0 3px;font-size:19px;line-height:1.2;font-weight:700;color:#064A97!important}
.hty .hty-card p{grid-column:2;align-self:start;margin:0;font-size:16px;line-height:1.35;color:#404446}
a.hty-card[data-i="1"]::before{background-position:0 8.3333%}
a.hty-card[data-i="2"]::before{background-position:0 16.6667%}
a.hty-card[data-i="3"]::before{background-position:0 25%}
a.hty-card[data-i="4"]::before{background-position:0 33.3333%}
a.hty-card[data-i="5"]::before{background-position:0 41.6667%}
a.hty-card[data-i="6"]::before{background-position:0 50%}
a.hty-card[data-i="7"]::before{background-position:0 58.3333%}
a.hty-card[data-i="8"]::before{background-position:0 66.6667%}
a.hty-card[data-i="9"]::before{background-position:0 75%}
a.hty-card[data-i="10"]::before{background-position:0 83.3333%}
.hty-l>li.more .hty-card{background:#17479E;border-color:#17479E}
.hty-l>li.more .hty-card::before{background-color:rgba(255,255,255,.14);background-position:0 91.6667%}
.hty .hty-l>li.more h3,.hty .hty-l>li.more p{color:#fff!important} /* h3: the site colour (.site-content h3, !important) on every page */
.hty .hty-l>li.more h3{font-size:20px}
.hty-l>li.more a.hty-card:hover{box-shadow:0 12px 28px rgba(23,71,158,.3)}
.hty-l>li.ai .hty-card::before{border-radius:50%;background:url(/web/images/hepsi-tek-yerde-ikon.svg) no-repeat 0 100%/100% 1300%;filter:drop-shadow(0 6px 14px rgba(23,71,158,.25))}
.hty-ts{grid-column:2;position:relative;height:24px;margin-top:2px;overflow:hidden}
.hty-ts span{position:absolute;inset:0;display:flex;align-items:center;gap:7px;font-size:16px;font-weight:600;color:#404446;white-space:nowrap;opacity:0}
.hty-ts span:first-child{opacity:1}
.hty-l>li.ai .hty-card.hty-pil::before{display:none}
.hty-ts span::before{content:"\2713";font-weight:800;color:#0E8196}
.hty-ts span:first-child::before{content:"\260E"}
.hty-ts span:last-child::after{content:"\20BA";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#22B6CD;color:#fff;font-size:12px;font-weight:800}
.hty-l>li[class^=c]::before,.hty-l>li[class^=c]::after{content:"\20BA";position:absolute;left:15px;top:50%;z-index:3;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:#22B6CD;color:#fff;font-size:17px;font-weight:800;line-height:30px;text-align:center;box-shadow:0 0 0 4px rgba(34,182,205,.3),0 4px 10px rgba(23,71,158,.3);opacity:0;pointer-events:none}
a.hty-card::after{content:"\2713";position:absolute;left:-12px;top:50%;margin-top:-12px;width:24px;height:24px;border-radius:50%;background:#fff;border:2px solid #14A3BB;color:#0E8196;font-size:14px;font-weight:800;line-height:20px;text-align:center;opacity:0;pointer-events:none}
.hty-l>li.more a.hty-card::after,.hty-l>li.ai a.hty-card::after{display:none}
.hty-l>li.hty-usd::before,.hty-l>li.hty-usd::after{content:"$"}
.hty-l>li.hty-eur::before,.hty-l>li.hty-eur::after{content:"\20AC"}
@media (max-width:1239px){.hty-pil .hty-ts{height:44px}.hty-pil .hty-ts span{align-items:flex-start;white-space:normal;line-height:1.25}.hty-pil .hty-ts span::before{margin-top:0}}
@media (max-width:379px){.hty-ts span{font-size:14px}.hty .hty-card h3{font-size:18px}}
.hty-pil .hty-av{grid-column:1;grid-row:1/span 2;align-self:center;position:relative;width:60px;height:60px;filter:drop-shadow(0 6px 14px rgba(23,71,158,.25))}
.hty-pil .hty-av svg{display:block;width:100%;height:100%;overflow:visible}
.hty-pil .hty-av svg *{transform-box:fill-box;transform-origin:center}
.hty-wv{position:absolute;inset:0;border-radius:50%;border:3px solid #22B6CD;opacity:0}
.hty-pil .p-tarama{opacity:0}
.hty-co{position:absolute;top:6px;left:calc(100% - 118px + var(--j,0)*28px);width:28px;height:28px;border-radius:50%;background:#22B6CD;color:#fff;font:800 16px/28px "Segoe UI",system-ui,sans-serif;text-align:center;opacity:0;pointer-events:none;box-shadow:0 0 0 3px rgba(34,182,205,.25)}
.hty-co:nth-of-type(2){--j:1}.hty-co:nth-of-type(3){--j:2}
.c1{--s:0}.c2{--s:2}.c3{--s:4}.c4{--s:6}.c5{--s:1}.c6{--s:3}.c7{--s:5}.c8{--s:7}
.hty-pp{display:flex;align-items:center;gap:10px;margin:20px auto 0;min-height:48px;padding:0 20px;border-radius:24px;border:1.5px solid #17479E;background:#fff;color:#17479E;font-size:16px;font-weight:600;line-height:1.2;font-family:inherit;cursor:pointer}
.hty-pp[hidden]{display:none}
.hty-pp:focus-visible{outline:3px solid #22B6CD;outline-offset:3px}
.hty-pp i{width:12px;height:14px;border-left:4px solid currentColor;border-right:4px solid currentColor}
.hty-pp[aria-pressed=true] i{width:0;height:0;border:7px solid transparent;border-left:12px solid currentColor;border-right:0}

@media (min-width:1240px) and (max-width:1299px){.hty{--sc:.88}}
@media (min-width:1300px) and (max-width:1359px){.hty{--sc:.93}}
@media (min-width:1360px) and (max-width:1387px){.hty{--sc:.98}}
@media (min-width:1240px){
.hty{padding:22px 14px 40px}
.hty .hty-sub{margin-bottom:14px}
.hty-fit{position:relative;width:calc(1360px*var(--sc));height:calc(840px*var(--sc));margin:0 auto}
.hty-scene{position:absolute;left:0;top:0;width:1360px;max-width:none;margin:0;height:840px;transform:scale(var(--sc));transform-origin:0 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1360 840'%3E%3Cpath d='M485 148C485 208 566.9 236.9 609.3 279.3M420 262C500 262 511 304.7 583.4 324.1M420 438C500 438 511 395.3 583.4 375.9M485 552C485 492 566.9 463.1 609.3 420.7M875 148C875 208 793.1 236.9 750.7 279.3M940 262C860 262 849 304.7 776.6 324.1M940 438C860 438 849 395.3 776.6 375.9M875 552C875 492 793.1 463.1 750.7 420.7M680 482V716' fill='none' stroke='%2322B6CD' stroke-opacity='.38' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat}
.hty-scene::before{display:none}
.hty-hub{position:absolute;left:580px;top:250px;width:200px;height:200px;margin:0}
.hty-hub img{width:56%}
.hty-hub::before{inset:-16px}
.hty-hub::after{inset:-30px}
.hty .hty-l{position:absolute;inset:0;margin:0}
.hty-l::before{display:none}
.hty-l>li,.hty-l>li.more{position:static;margin:0;padding:0;background:none}
.hty-card{position:absolute;left:var(--x);top:var(--y);z-index:1;width:390px;height:124px;min-height:0;padding:10px 18px;column-gap:16px}
.hty-card::before{width:64px;height:64px;border-radius:18px}
.hty .hty-card h3{font-size:21px;margin-bottom:4px}
.hty .hty-card p{font-size:17px;line-height:1.35}
.hty .hty-l>li.more h3{font-size:21px}
.hty-l>li.ai .hty-card{--x:275px;--y:716px;z-index:2}
.hty-l>li.more .hty-card{--x:695px;--y:716px}
.c1{--x:170px;--y:30px;--s:0;--tx:315px;--ty:118px;--p:'M485 148C485 208 566.9 236.9 609.3 279.3'}
.c2{--x:30px;--y:200px;--s:2;--tx:390px;--ty:62px;--p:'M420 262C500 262 511 304.7 583.4 324.1'}
.c3{--x:30px;--y:376px;--s:4;--tx:390px;--ty:62px;--p:'M420 438C500 438 511 395.3 583.4 375.9'}
.c4{--x:170px;--y:546px;--s:6;--tx:315px;--ty:6px;--p:'M485 552C485 492 566.9 463.1 609.3 420.7'}
.c5{--x:800px;--y:30px;--s:1;--tx:75px;--ty:118px;--p:'M875 148C875 208 793.1 236.9 750.7 279.3'}
.c6{--x:940px;--y:200px;--s:3;--tx:0px;--ty:62px;--p:'M940 262C860 262 849 304.7 776.6 324.1'}
.c7{--x:940px;--y:376px;--s:5;--tx:0px;--ty:62px;--p:'M940 438C860 438 849 395.3 776.6 375.9'}
.c8{--x:800px;--y:546px;--s:7;--tx:75px;--ty:6px;--p:'M875 552C875 492 793.1 463.1 750.7 420.7'}
.hty-l>li[class^=c]::before,.hty-l>li[class^=c]::after{left:0;top:0;width:38px;height:38px;margin:0;font-size:21px;line-height:38px;box-shadow:0 0 0 5px rgba(34,182,205,.3),0 6px 14px rgba(23,71,158,.35);offset-path:path(var(--p));offset-rotate:0deg;offset-anchor:50% 50%;offset-distance:0%}
a.hty-card::after{left:calc(var(--tx) - 15px);top:calc(var(--ty) - 15px);width:30px;height:30px;border-width:3px;font-size:18px;line-height:24px;margin:0}
.hty-pil .hty-av{width:76px;height:76px}
.hty-pp{position:absolute;right:0;bottom:0;margin:0;padding:0 16px;gap:8px}
}

@media (prefers-reduced-motion:no-preference){
.hty-on{--n:6}
.hty-on .hty-ring{animation:hty-ring 1.5s ease-out 1.9s calc(var(--n)*8)}
.hty-on .hty-l>li.ai .hty-card::before{animation:hty-bob 12s ease-in-out 0s var(--n)}
.hty-on .hty-ts span{animation:hty-ts2 12s ease-in-out 0s var(--n) both}
.hty-on .hty-l>li[class^=c] .hty-card{animation:hty-vur 12s ease-in-out calc(var(--s,0)*1.5s) var(--n)}
.hty-on .hty-av{animation:hty-bobb 2.8s ease-in-out 0s calc(var(--n)*5)}
.hty-on .hty-wv{animation:hty-wv 1.6s ease-out 0s calc(var(--n)*8)}
.hty-on .hty-wv.w2{animation-delay:.35s}
.hty-on .hty-co{animation:hty-co 3.6s ease-out calc(var(--j,0)*.5s) calc(var(--n)*4)}
.hty-pil .p-govde{animation:hty-nefes 2.4s ease-in-out infinite}
.hty-pil .p-radar{animation:hty-don 6s linear infinite}
.hty-pil .p-tarama{animation:hty-tara 2s ease-in-out infinite}
.hty-pil .p-antenUc{animation:hty-sinyal 1.3s ease-in-out infinite}
.hty-pil .p-antenHalka{animation:hty-halka 1.3s ease-out infinite}
.hty-pil .p-goz{animation:hty-kirp 3.6s ease-in-out infinite}
.hty-pil .p-gozSag{animation-delay:.07s}
.hty-on .hty-ts span:nth-child(2){animation-delay:3s}
.hty-on .hty-ts span:nth-child(3){animation-delay:6s}
.hty-on .hty-ts span:nth-child(4){animation-delay:9s}
.hty-on .hty-l>li::before{animation:hty-mcoin 12s ease-out calc(var(--s,0)*1.5s) var(--n)}
.hty-on .hty-l>li::after{animation:hty-mcoin 12s ease-out calc(var(--s,0)*1.5s + .35s) var(--n)}
.hty-on a.hty-card::after{animation:hty-tick 12s ease-out calc(var(--s,0)*1.5s) var(--n)}
.hty-pz *,.hty-pz *::before,.hty-pz *::after,.hty-vz *,.hty-vz *::before,.hty-vz *::after{animation-play-state:paused!important}
@keyframes hty-ring{0%{opacity:.6;transform:scale(1)}100%{opacity:0;transform:scale(1.22)}}
@keyframes hty-bob{0%,25%,50%,75%,100%{transform:translateY(0)}12.5%,37.5%,62.5%,87.5%{transform:translateY(-4px)}}
@keyframes hty-ts2{0%{opacity:0;transform:translateX(-22px) scale(.94)}3%,21%{opacity:1;transform:none}25%,100%{opacity:0;transform:translateX(22px) scale(.96)}}
@keyframes hty-vur{0%,8.6%{transform:none;box-shadow:0 1px 2px rgba(23,71,158,.06),0 8px 22px rgba(23,71,158,.07)}10%{transform:translateY(-8px) scale(1.04);box-shadow:0 18px 36px rgba(34,182,205,.38)}13%{transform:translateY(-3px) scale(1.015)}17%,100%{transform:none;box-shadow:0 1px 2px rgba(23,71,158,.06),0 8px 22px rgba(23,71,158,.07)}}
@keyframes hty-bobb{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-8px) rotate(-4deg)}50%{transform:translateY(0) rotate(0)}75%{transform:translateY(-6px) rotate(4deg)}}
@keyframes hty-wv{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(1.8)}}
@keyframes hty-co{0%{opacity:0;transform:translateY(0) scale(.5)}12%{opacity:1;transform:translateY(-10px) scale(1.2)}60%{opacity:1;transform:translateY(-46px) scale(1)}100%{opacity:0;transform:translateY(-66px) scale(.9)}}
@keyframes hty-nefes{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.09) rotate(-2deg)}}
@keyframes hty-don{to{transform:rotate(360deg)}}
@keyframes hty-tara{0%,100%{transform:translateX(0);opacity:.15}50%{transform:translateX(19px);opacity:.8}}
@keyframes hty-sinyal{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.15);opacity:1}}
@keyframes hty-halka{0%{transform:scale(.7);opacity:.9}100%{transform:scale(1.6);opacity:0}}
@keyframes hty-kirp{0%,90%,100%{transform:scaleY(1)}94%{transform:scaleY(.1)}}
@keyframes hty-ts{0%{opacity:0;transform:translateY(10px) scale(.94)}3%,21%{opacity:1;transform:none}25%,100%{opacity:0;transform:translateY(-8px)}}
@keyframes hty-mcoin{0%,9%{opacity:0;transform:translateY(0) scale(.6)}11%{opacity:1;transform:translateY(0) scale(1)}16%{opacity:1;transform:translateY(calc(var(--d,60px)*-1)) scale(1)}18%,100%{opacity:0;transform:translateY(calc(var(--d,60px)*-1)) scale(1.3)}}
@keyframes hty-tick{0%,8%{opacity:0;transform:scale(0)}10%{opacity:1;transform:scale(1.25)}12%{transform:scale(1)}18%{opacity:1}20%,100%{opacity:0;transform:scale(1)}}
@keyframes hty-dcoin{0%,9%{opacity:0;offset-distance:0%;transform:scale(.6)}11%{opacity:1;transform:scale(1.3)}16%{opacity:1;offset-distance:100%;transform:scale(1)}18%,100%{opacity:0;offset-distance:100%;transform:scale(1.3)}}
@media (min-width:1240px){
.hty-on .hty-l>li::before,.hty-on .hty-l>li::after{animation-name:hty-dcoin}
}
}
