@font-face{font-family:Archivo;font-style:normal;font-display:swap;font-weight:800 900;font-stretch:100% 125%;src:url(/fonts/archivo-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:Archivo;font-style:normal;font-display:swap;font-weight:800 900;font-stretch:100% 125%;src:url(/fonts/archivo-latin.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

body{margin:0;background:#12050A}
a{color:#FF4D5E}a:hover{color:#FF8A95}
summary{cursor:pointer;list-style:none}
summary::-webkit-details-marker{display:none}
input,select,button{font:inherit}

@keyframes blob{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(1.15)}}
@keyframes words{0%,26%{transform:translateY(0)}33%,59%{transform:translateY(-1.25em)}66%,92%{transform:translateY(-2.5em)}100%{transform:translateY(-3.75em)}}
@keyframes road{to{stroke-dashoffset:108}}
@keyframes sc640{to{transform:translateX(-640px)}}
@keyframes sc320{to{transform:translateX(-320px)}}
@keyframes puff{0%{transform:translate(0,0) scale(.4);opacity:.55}100%{transform:translate(-90px,-18px) scale(2.8);opacity:0}}
@keyframes dust{0%{transform:translate(0,0) scale(.5);opacity:.45}100%{transform:translate(-70px,-6px) scale(2.2);opacity:0}}
@keyframes flick{0%,100%{opacity:.9}50%{opacity:.65}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes bob{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-1.5px) rotate(-.2deg)}60%{transform:translateY(-.5px) rotate(.15deg)}}
@keyframes city{to{transform:translateX(-600px)}}
@keyframes speed{0%{transform:translateX(40px);opacity:0}30%{opacity:1}100%{transform:translateX(-120px);opacity:0}}
@keyframes float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-14px) rotate(3deg)}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes ripple{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.9);opacity:0}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(225,24,47,.55)}50%{box-shadow:0 0 0 14px rgba(225,24,47,0)}}
@keyframes rise{from{opacity:0;transform:translateY(48px)}to{opacity:1;transform:none}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes shine{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes rot{to{transform:rotate(360deg)}}
@keyframes intro{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}

.blob{position:absolute;border-radius:50%;-webkit-mask-image:radial-gradient(closest-side,#000 0%,rgba(0,0,0,.45) 45%,transparent 100%);mask-image:radial-gradient(closest-side,#000 0%,rgba(0,0,0,.45) 45%,transparent 100%);animation:blob 12s ease-in-out infinite;will-change:transform}
.words{display:inline-block;height:1.25em;overflow:hidden;vertical-align:top;margin-top:-.115em}
.words>span{display:flex;flex-direction:column;animation:words 7.5s cubic-bezier(.7,0,.2,1) infinite}
.words>span>span{height:1.25em;line-height:1.25em;white-space:nowrap}
.dash{animation:road .4s linear infinite}
.curb{animation:road .4s linear infinite}
.mtn{animation:sc640 48s linear infinite}
.cty{animation:sc640 10s linear infinite}
.near{animation:sc320 1.15s linear infinite}
.puff{transform-box:fill-box;transform-origin:center;animation:puff 1.4s ease-out infinite}
.dust{transform-box:fill-box;transform-origin:center;animation:dust .9s ease-out infinite}
.beam{animation:flick 3s ease-in-out infinite}
.wheel{transform-box:fill-box;transform-origin:center;animation:spin .6s linear infinite}
.truck{transform-box:fill-box;transform-origin:50% 100%;animation:bob .7s ease-in-out infinite}
.city{animation:city 18s linear infinite}
.spd{animation:speed 1s linear infinite}
.chip{animation:float 5s ease-in-out infinite}
.marq{display:flex;width:max-content;animation:marquee 26s linear infinite}
.intro{animation:intro .9s cubic-bezier(.2,.7,.2,1) both}
.shine{background:linear-gradient(100deg,#FFFFFF 40%,#FF9AA4 50%,#FFFFFF 60%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 5s linear infinite}

.btn{transition:transform .25s,box-shadow .25s,background .25s}
.btn:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(225,24,47,.45)}
.pulse{animation:pulse 2s ease-out infinite}
.ring{position:absolute;inset:0;border-radius:999px;border:2px solid #FF4D5E;animation:ripple 2s ease-out infinite;pointer-events:none}

.svc{position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,color .35s}
.svc::before{content:"";position:absolute;inset:0;background:#E1182F;transform:translateY(101%);transition:transform .45s cubic-bezier(.7,0,.2,1);z-index:0}
.svc>*{position:relative;z-index:1}
.svc:hover{transform:translateY(-10px);box-shadow:0 30px 60px rgba(120,10,25,.25);color:#FFFFFF}
.svc:hover::before{transform:none}
.svc:hover p{color:#FFE3E6 !important}
.svc:hover .ico{background:#FFFFFF !important}
.svc:hover .ico svg{stroke:#E1182F}
.svc .arr{transition:transform .35s}
.svc:hover .arr{transform:translateX(8px)}
.ico{transition:background .35s}
.ico svg{transition:stroke .35s}

.field{transition:border-color .2s,box-shadow .2s}
.field:focus{outline:none;border-color:#FF4D5E !important;box-shadow:0 0 0 4px rgba(255,77,94,.25)}
.badge-rot{animation:rot 16s linear infinite;transform-origin:center}
.faq{transition:background .25s,border-color .25s}
.faq[open]{background:#FFFFFF !important;border-color:#E1182F !important}
.faq .pl{transition:transform .3s}
.faq[open] .pl{transform:rotate(45deg)}

@keyframes wig{0%,80%,100%{transform:rotate(0)}84%,92%{transform:rotate(-16deg)}88%,96%{transform:rotate(16deg)}}
.wig{animation:wig 2.2s ease-in-out infinite;transform-origin:50% 50%}
.mob{display:none}
.callbar{display:none}
@media (max-width: 1100px){
.navx{display:none !important}
.gal-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.igt{font-size:20px !important}
}
@media (max-width: 400px){
.callnum{font-size:25px !important}
.hero-in .mob{padding-left:80px !important}
}
@media (max-width: 760px){
.desk{display:none !important}
.mob{display:flex !important}
.callbar{display:flex !important}
.hero-in{padding-top:24px !important;padding-bottom:48px !important;gap:22px !important;flex-direction:column !important;flex-wrap:nowrap !important;align-items:stretch !important}
.hero-txt{display:contents !important}
.hero-txt > *{order:4}
.hb{order:1}
.hero-scene{order:2;flex:none !important;margin:14px 0 0}
.hero-scene{display:flex;flex-wrap:wrap;gap:8px}
.hero-scene > svg{flex:0 0 100%}
.hero-scene .chip{position:static !important;animation:none !important;font-size:12.5px !important;padding:8px 12px !important;box-shadow:none !important}
.hero-scene .chip:nth-of-type(1){order:2}.hero-scene .chip:nth-of-type(2){order:3}
.hero-title{font-size:46px !important}
h2{font-size:38px !important}
footer .marq{font-size:72px !important}
.pb{padding-bottom:84px}
.pm-t{width:96px !important;height:72px !important;border-radius:10px !important}
.pm{gap:8px !important;padding:0 !important;order:3;margin-top:0;margin-bottom:14px}
.pm-row{gap:8px !important;--pmg:8px}
.igt{font-size:17px !important}
.svc{padding:24px !important}
.bdg{width:96px !important;height:96px !important;top:-44px !important}
.gal-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important}
button.gal-item span{font-size:12px !important}
.track{display:none}
.bdg{right:-6px !important;top:-36px !important;bottom:auto !important}
.bdg svg.badge-rot{width:100%;height:100%}
.brandc{height:auto !important;min-height:460px;padding:28px !important;gap:28px}
.n15{font-size:150px !important}
.rvw figure{width:290px !important}
}
.rvw:hover .marq{animation-play-state:paused}
.skip{position:absolute;left:-9999px;top:8px;z-index:300;background:#FFFFFF;color:#12050A;padding:10px 16px;border-radius:8px;font-weight:700}
.skip:focus{left:16px}
.chk{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1.5px solid #E2C5CA;border-radius:999px;font-size:14px;font-weight:600;color:#4A3338;background:#FFFBFA;cursor:pointer;box-sizing:border-box}
.chk:has(input:checked){background:#FCE6E8;border-color:#E1182F;color:#B3122E}
.chk input{accent-color:#E1182F;width:16px;height:16px;margin:0}
.pm{position:relative;flex:none;width:100vw;margin-left:calc(50% - 50vw);display:flex;flex-direction:column;gap:12px;padding:8px 0 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.pm-row{display:flex;gap:12px;width:max-content}
.pm-l{animation:pm-l 130s linear infinite}
.pm-r{animation:pm-r 120s linear infinite}
.pm:hover .pm-row{animation-play-state:paused}
@keyframes pm-l{from{transform:translateX(0)}to{transform:translateX(calc(-50% - var(--pmg,12px) / 2))}}
@keyframes pm-r{from{transform:translateX(calc(-50% - var(--pmg,12px) / 2))}to{transform:translateX(0)}}
.pm-t{flex:none;width:160px;height:116px;padding:0;border:0;border-radius:14px;overflow:hidden;cursor:zoom-in;background:#2A0B13;box-shadow:0 10px 24px rgba(0,0,0,0.35);opacity:.9;transition:opacity .25s,transform .25s}
.pm-t:hover{opacity:1;transform:translateY(-3px)}
.pm-t img{display:block;width:100%;height:100%;object-fit:cover}
.gtab{min-height:44px;padding:0 18px;border-radius:999px;font-weight:700;font-size:14px;cursor:pointer;background:transparent;color:#F3D6DA;border:2px solid rgba(255,255,255,0.25)}
.gtab.on{background:#E1182F;color:#FFFFFF;border-color:#E1182F}
.gal-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.gal-item img{transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.gal-item:hover img{transform:scale(1.06)}
.gal-item:focus-visible{outline:3px solid #FF4D5E;outline-offset:3px}
@supports (animation-timeline: view()){
.rv{animation:rise linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
.ln{transform-origin:left;animation:grow linear both;animation-timeline:view();animation-range:entry 20% cover 50%}
}
@keyframes l-elev{0%,15%{transform:rotate(0)}60%,100%{transform:rotate(-50deg)}}
@keyframes l-lvl{0%,15%{transform:rotate(0)}60%,100%{transform:rotate(50deg)}}
@keyframes l-tele{0%,60%{transform:translateX(0)}85%,100%{transform:translateX(30px)}}
@keyframes l-low{0%,62%{transform:translateX(100px)}90%,100%{transform:translateX(0)}}
@keyframes l-leg{0%{transform:scaleY(.1)}15%,100%{transform:scaleY(1)}}
@keyframes l-foot{0%{transform:translateY(-35px)}15%,100%{transform:translateY(0)}}
@keyframes l-body{0%{transform:translateY(0)}15%,100%{transform:translateY(-3px)}}
@keyframes l-carin{0%,90%{opacity:0}100%{opacity:1}}
@keyframes l-car{0%,20%{transform:translateX(-142px)}50%,62%{transform:translateX(250px)}92%,100%{transform:translateX(-142px)}}
@keyframes l-cable{0%,20%{transform:scaleX(-142)}50%,62%{transform:scaleX(250)}92%,100%{transform:scaleX(-142)}}
@keyframes l-load{0%,4%{transform:translateX(-36px);opacity:0}6%{transform:translateX(-36px);opacity:1}18%,52%{transform:translateX(0);opacity:1}60%{transform:translateX(36px);opacity:1}61%,100%{transform:translateX(36px);opacity:0}}
@keyframes l-drop{0%,58%{opacity:0}60%,90%{opacity:1}95%,100%{opacity:0}}
@keyframes l-work{0%,42%{opacity:0;transform:translateX(16px)}49%,90%{opacity:1;transform:translateX(0)}97%,100%{opacity:0;transform:translateX(16px)}}
@keyframes l-sway{0%,50%{transform:rotate(0)}51.5%{transform:rotate(3deg)}53%{transform:rotate(-2deg)}54.5%{transform:rotate(1deg)}56%,62%{transform:rotate(0)}64%{transform:rotate(-2deg)}66%{transform:rotate(1deg)}68%,92%{transform:rotate(0)}93.5%{transform:rotate(2deg)}95%{transform:rotate(-1deg)}96.5%,100%{transform:rotate(0)}}
@keyframes l-xa{0%,43.7%{opacity:1}43.8%,93.7%{opacity:0}93.8%,100%{opacity:1}}
@keyframes l-xb{0%,43.7%{opacity:0}43.8%,93.7%{opacity:1}93.8%,100%{opacity:0}}
@keyframes l-ya{0%,50%{opacity:1}50.1%,100%{opacity:0}}
@keyframes l-yb{0%,50%{opacity:0}50.1%,100%{opacity:1}}
@keyframes l-beacon{0%,49%{opacity:1}50%,100%{opacity:.25}}
@keyframes l-cloud{to{transform:translateX(-700px)}}
.l-elev{transform-box:view-box;transform-origin:0 0;transform:rotate(-50deg);animation:l-elev 5s ease-in-out 1 both}
.l-lvl{transform-box:view-box;transform-origin:0 0;transform:rotate(50deg);animation:l-lvl 5s ease-in-out 1 both}
.l-tele{transform:translateX(30px);animation:l-tele 5s ease-in-out 1 both}
.l-low{animation:l-low 5s ease-in-out 1 both}
.l-leg{transform-box:fill-box;transform-origin:50% 0;animation:l-leg 5s ease-in-out 1 both}
.l-foot{animation:l-foot 5s ease-in-out 1 both}
.l-body{transform:translateY(-3px);animation:l-body 5s ease-in-out 1 both}
.l-carin{animation:l-carin 5s linear 1 both}
.l-car{transform:translateX(-142px);animation:l-car 8s ease-in-out 5s infinite both}
.l-cable{transform-box:view-box;transform-origin:0 0;transform:scaleX(-142);animation:l-cable 8s ease-in-out 5s infinite both}
.l-load{animation:l-load 8s ease-in-out 5s infinite both}
.l-drop{opacity:0;animation:l-drop 8s ease-in-out 5s infinite both}
.l-work{opacity:0;animation:l-work 8s ease-in-out 5s infinite both}
.l-sway{transform-box:view-box;transform-origin:0 0;animation:l-sway 8s linear 5s infinite both}
.l-iA{animation:l-xa 16s linear 5s infinite both}
.l-iB{opacity:0;animation:l-xb 16s linear 5s infinite both}
.l-dA{animation:l-ya 16s linear 5s infinite both}
.l-dB{opacity:0;animation:l-yb 16s linear 5s infinite both}
.l-beacon{animation:l-beacon .9s steps(1) infinite}
.l-cloud{animation:l-cloud 70s linear infinite}
@keyframes m-boxes{0%,5%{opacity:1;transform:translateY(0)}10%,94%{opacity:0;transform:translateY(20px)}98%,100%{opacity:1;transform:translateY(0)}}
@keyframes m-wr{0%,94%{opacity:1}97%,100%{opacity:0}}
@keyframes m-base{0%,7%{opacity:0;transform:translateX(-90px)}13%,100%{opacity:1;transform:translateX(0)}}
@keyframes m-left{0%,14%{transform:scaleY(0)}23%,100%{transform:scaleY(1)}}
@keyframes m-right{0%,23%{transform:scaleY(0)}32%,100%{transform:scaleY(1)}}
@keyframes m-top{0%,32%{opacity:0;transform:translateY(-70px)}39%,100%{opacity:1;transform:translateY(0)}}
@keyframes m-back{0%,39%{opacity:0}45%,100%{opacity:1}}
@keyframes m-inner{0%,45%{transform:scaleY(0)}53%,100%{transform:scaleY(1)}}
@keyframes m-clothes{0%,54%{opacity:0;transform:translateY(-16px)}62%,100%{opacity:1;transform:translateY(0)}}
@keyframes m-door{0%,64%{transform:scaleX(0)}72%,100%{transform:scaleX(1)}}
@keyframes m-door3{0%,68%{transform:scaleX(0)}76%,100%{transform:scaleX(1)}}
@keyframes m-hd{0%,77%{opacity:0;transform:scale(.4)}80%,100%{opacity:1;transform:scale(1)}}
@keyframes m-done{0%,81%{opacity:0;transform:scale(.3)}84%{opacity:1;transform:scale(1.15)}86%,92%{opacity:1;transform:scale(1)}95%,100%{opacity:0;transform:scale(1)}}
@keyframes m-sp{0%{opacity:0;transform:scale(.2) rotate(0)}3%{opacity:1;transform:scale(1.2) rotate(45deg)}7%,100%{opacity:0;transform:scale(.4) rotate(90deg)}}
@keyframes m-prog{0%,6%{transform:scaleX(0)}84%,94%{transform:scaleX(1)}100%{transform:scaleX(0)}}
@keyframes m-drill{0%{transform:translate(0,0)}100%{transform:translate(.12px,0)}}
@keyframes m-bit{to{stroke-dashoffset:-1.6}}
@keyframes m-tip{0%,49%{opacity:1}50%,100%{opacity:0}}
.m-boxes{animation:m-boxes 14s ease-in-out infinite}
.m-wr{animation:m-wr 14s ease-in-out infinite}
.m-base{animation:m-base 14s ease-out infinite}
.m-left{transform-box:fill-box;transform-origin:50% 100%;animation:m-left 14s ease-out infinite}
.m-right{transform-box:fill-box;transform-origin:50% 100%;animation:m-right 14s ease-out infinite}
.m-top{animation:m-top 14s cubic-bezier(.3,1.4,.6,1) infinite}
.m-back{animation:m-back 14s ease-in-out infinite}
.m-inner{transform-box:fill-box;transform-origin:50% 100%;animation:m-inner 14s ease-out infinite}
.m-clothes{animation:m-clothes 14s ease-out infinite}
.m-d1{transform-box:fill-box;transform-origin:0 50%;animation:m-door 14s ease-in-out infinite}
.m-d2{transform-box:fill-box;transform-origin:100% 50%;animation:m-door 14s ease-in-out infinite}
.m-d3{transform-box:fill-box;transform-origin:100% 50%;animation:m-door3 14s ease-in-out infinite}
.m-hd{transform-box:fill-box;transform-origin:center;animation:m-hd 14s ease-out infinite}
.m-done{transform-box:fill-box;transform-origin:center;animation:m-done 14s ease-out infinite}
.m-sp{opacity:0;transform-box:fill-box;transform-origin:center;animation:m-sp 14s ease-out infinite}
.s1{animation-delay:1.8s}.s2{animation-delay:4.4s}.s3{animation-delay:3.2s}.s4{animation-delay:5.5s}.s5{animation-delay:7.4s}.s6{animation-delay:7.6s}
.m-prog{transform-box:fill-box;transform-origin:0 50%;animation:m-prog 14s linear infinite}
.m-drill{animation:m-drill .08s linear infinite alternate}
.m-bit{animation:m-bit .08s linear infinite}
.m-tip{animation:m-tip .5s steps(1) infinite}
@keyframes a-fclip{0%,4%{transform:scaleY(0)}34%,100%{transform:scaleY(1)}}
@keyframes a-bclip{0%,36%{transform:scaleY(0)}60%,100%{transform:scaleY(1)}}
@keyframes a-wrap{0%,93%{opacity:1}98%,100%{opacity:0}}
@keyframes a-tape{0%,62%{transform:scaleX(0)}70%,100%{transform:scaleX(1)}}
@keyframes a-label{0%,72%{opacity:0;transform:scale(.3) rotate(-12deg)}76%{opacity:1;transform:scale(1.12) rotate(3deg)}78%,100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes a-done{0%,79%{opacity:0;transform:scale(.3)}82%{opacity:1;transform:scale(1.15)}84%,91%{opacity:1;transform:scale(1)}94%,100%{opacity:0}}
@keyframes a-ry{0%,3%{opacity:0;transform:translateY(388px)}5%{opacity:1;transform:translateY(388px)}34%{opacity:1;transform:translateY(176px)}37%,100%{opacity:0;transform:translateY(176px)}}
@keyframes a-rx{0%{transform:translateX(212px)}100%{transform:translateX(438px)}}
@keyframes a-c1{0%,4%{opacity:0}5%,34%{opacity:1}35%,100%{opacity:0}}
@keyframes a-c2{0%,36%{opacity:0}37%,60%{opacity:1}61%,100%{opacity:0}}
@keyframes a-c3{0%,62%{opacity:0}63%,70%{opacity:1}71%,100%{opacity:0}}
@keyframes a-c4{0%,72%{opacity:0}73%,92%{opacity:1}93%,100%{opacity:0}}
.a-fclip{transform-box:fill-box;transform-origin:50% 100%;animation:a-fclip 14s ease-in-out infinite}
.a-bclip{transform-box:fill-box;transform-origin:50% 0;animation:a-bclip 14s ease-in-out infinite}
.a-wrap{animation:a-wrap 14s ease-in-out infinite}
.a-tape{transform-box:fill-box;transform-origin:0 50%;animation:a-tape 14s ease-out infinite}
.a-label{transform-box:fill-box;transform-origin:center;animation:a-label 14s ease-out infinite}
.a-done{transform-box:fill-box;transform-origin:center;animation:a-done 14s ease-out infinite}
.a-ry{opacity:0;animation:a-ry 14s linear infinite}
.a-rx{animation:a-rx .9s ease-in-out infinite alternate}
.a-chip{opacity:0}.c1{animation:a-c1 14s linear infinite}.c2{animation:a-c2 14s linear infinite}.c3{animation:a-c3 14s linear infinite}.c4{animation:a-c4 14s linear infinite}
@media (prefers-reduced-motion: reduce){
*,*::before{animation:none !important;transition:none !important}
}

[hidden]{display:none !important}
/* --- alt sayfalar --- */
.sp-crumb{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:14px;color:#E6C2C7;margin:0;padding:0;list-style:none}
.sp-crumb a{color:#FFFFFF;text-decoration:none;font-weight:600}
.sp-crumb li+li::before{content:"›";margin-right:6px;color:#C9A3A9}
.sp-body h2{margin:0 0 14px;font-family:Archivo,sans-serif;font-weight:900;font-stretch:110%;font-size:34px;line-height:1.08;letter-spacing:-0.02em;color:#1E0A0F}
.sp-body p{margin:0 0 14px;font-size:17px;line-height:1.75;color:#5A3D44}
.sp-body ul,.sp-body ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.sp-body li{position:relative;padding-left:40px;font-size:17px;line-height:1.6;color:#2A1A1F}
.sp-body ul li::before{content:"";position:absolute;left:0;top:2px;width:26px;height:26px;border-radius:50%;background:#E1182F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/14px no-repeat}
.sp-body ol{counter-reset:s}
.sp-body ol li{counter-increment:s}
.sp-body ol li::before{content:counter(s);position:absolute;left:0;top:0;width:28px;height:28px;border-radius:50%;background:#12050A;color:#FFFFFF;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center}
.sp-chips{display:flex;flex-wrap:wrap;gap:8px}
.sp-chips span{background:#FFFFFF;border:1px solid #F1D9DC;border-radius:999px;padding:8px 14px;font-weight:600;font-size:14px}
.sp-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.sp-photos figure{margin:0;border-radius:16px;overflow:hidden;background:#F3E6E8;position:relative}
.sp-photos img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.sp-photos figcaption{position:absolute;left:0;right:0;bottom:0;padding:30px 12px 12px;background:linear-gradient(transparent,rgba(18,5,10,.85));color:#fff;font-size:13px;font-weight:600}
.sp-rel{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.sp-rel a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:56px;padding:14px 18px;border-radius:14px;border:1px solid #F1D9DC;background:#FFFFFF;color:#1E0A0F;text-decoration:none;font-weight:700;transition:border-color .2s,transform .2s}
.sp-rel a:hover{border-color:#E1182F;transform:translateY(-2px)}
@media (max-width:760px){.sp-h1{font-size:40px !important}.sp-body h2{font-size:28px}.sp-photos{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}

/* performans */
html.wait *:not(.intro),html.wait *::before{animation-play-state:paused !important}
main > section:not(:first-of-type){content-visibility:auto;contain-intrinsic-size:auto 900px}
footer{content-visibility:auto;contain-intrinsic-size:auto 700px}
