@font-face{font-family:Chakra;src:url('assets/ChakraPetch-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
/* Match the slogan's family, using its readable regular face for body copy. */
body{font-family:Chakra,Body,Arial,sans-serif}
body :is(p,li,dt,dd,button,a,address,summary,label,input){font-family:Chakra,Body,Arial,sans-serif!important}
/* Slogan, headings and the approved artwork keep their own weights and styles. */
header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-rows:auto auto;height:auto;min-height:0;gap:2px 24px;padding:10px 0 12px;align-items:center}
header .brand{grid-column:2;grid-row:1;justify-self:center;justify-content:center;min-width:0}
header .official-nav-logo{display:block;width:200px;max-width:100%;height:auto;max-height:none;aspect-ratio:604/313;object-fit:contain}
header .nav-contact{grid-column:3;grid-row:1;justify-self:end;align-self:center}
header nav{grid-column:1/-1;grid-row:2;justify-self:center;justify-content:center;width:auto;max-width:100%;flex-wrap:wrap;gap:4px 32px}
header nav a{padding:8px 0}
/* Lift the map to the top of the whole contact block, rather than extending its bottom. */
body:not(.product-page) .contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;column-gap:clamp(28px,3vw,56px);row-gap:0;align-items:start}
.contact>.eyebrow{grid-column:1;grid-row:1}
.contact>.contact-heading{grid-column:1;grid-row:2;min-width:0;margin-top:16px}
.contact>.contact-intro{grid-column:1;grid-row:3;margin:22px 0 28px;max-width:none}
.contact>.contact-information{grid-column:1;grid-row:4;min-width:0}
.contact>.contact-location{grid-column:2;grid-row:1/span 4;align-self:stretch;display:flex;flex-direction:column;min-width:0;min-height:0}
.contact .map-frame{height:auto;min-height:570px;flex:1;position:relative}
.contact .map-frame iframe{position:absolute;inset:0;width:100%;height:100%}
.contact .map-caption{flex-shrink:0}
.contact .big-arrow{display:none}
.contact .contact-heading h2{font-size:clamp(30px,3.1vw,56px);line-height:1.15;max-width:100%}
.contact .contact-intro{font-size:19px;line-height:1.7}
@media(max-width:1100px){
 header{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:2px 20px;padding:10px 0 12px}
 header .official-nav-logo{width:190px}
 header nav{gap:4px 26px}
 .contact .contact-heading h2{font-size:clamp(30px,3.35vw,39px)}
 .contact .contact-intro{font-size:18px}
 .contact .map-frame{min-height:570px}
}
@media(max-width:760px){
 header{grid-template-columns:minmax(0,1fr) auto;gap:4px 14px;padding:10px 0}
 header .brand{grid-column:1;grid-row:1;justify-self:center;max-width:100%}
 header .official-nav-logo{width:168px;max-width:100%;height:auto}
 header .nav-contact{grid-column:2;grid-row:1;justify-self:end}
 header nav{grid-column:1/-1;grid-row:2;justify-self:center;justify-content:center;gap:4px 24px;width:100%}
 body:not(.product-page) .contact{display:block}
 .contact .contact-heading h2{font-size:clamp(29px,7.4vw,42px)}
 .contact>.contact-intro{margin:20px 0 26px}
 .contact>.contact-location{display:block;margin-top:28px}
 .contact .map-frame{height:520px;min-height:0}
}
@media(max-width:390px){header{gap:4px 10px}header .official-nav-logo{width:154px}header nav{gap:4px 16px}header .nav-contact{padding:10px 11px;gap:10px}}

/* Requested wider two-line logo: original MCK and elektronik artwork, independently stretched horizontally. */
header{grid-template-columns:140px minmax(0,1fr) 140px;column-gap:24px;row-gap:10px;padding-top:16px}
header .brand{width:min(100%,580px);max-width:100%;display:block}
header .nav-logo-stack{display:grid;width:100%;justify-items:center;gap:3px}
header .nav-logo-stack img{display:block;max-width:100%;object-fit:fill}
header .nav-logo-mck{width:94%;height:76px}
header .nav-logo-elektronik{width:100%;height:36px}
header nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:min(100%,1160px);gap:8px 24px;text-align:center}
header nav a{font-size:clamp(20px,2vw,26px);font-weight:700;line-height:1.25;letter-spacing:.015em;padding:12px 4px;color:#f5f2f8}
header nav a:hover{color:var(--cyan)}
@media(max-width:1100px){header{grid-template-columns:126px minmax(0,1fr) 126px;column-gap:16px}header nav{gap:8px 12px}header nav a{font-size:20px}}
@media(max-width:760px){
 header{grid-template-columns:minmax(0,1fr);row-gap:8px;padding-top:14px}
 header .brand{grid-column:1;grid-row:1;width:min(100%,440px);justify-self:center}
 header .nav-logo-mck{height:64px}
 header .nav-logo-elektronik{height:30px}
 header .nav-contact{grid-column:1;grid-row:2;justify-self:center}
 header nav{grid-column:1;grid-row:3;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:4px 12px}
 header nav a{font-size:18px;padding:10px 2px}
}

/* Center the requested section labels and titles, without moving cards, copy or map. */
#deneyim>.section-head,#hizmetler>.wrap>.section-head,#mck>.about-heading{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}
#deneyim>.section-head>div,#hizmetler>.wrap>.section-head>div,#mck>.about-heading>div{width:100%;max-width:none;text-align:center}
#deneyim .section-head .eyebrow,#hizmetler .section-head .eyebrow,#mck .about-heading .eyebrow,#iletisim>.eyebrow{justify-content:center;text-align:center}
#catalog-title,#hizmetler .section-head h2,#about-title{margin-left:auto;margin-right:auto;text-align:center}
#iletisim>.contact-heading{justify-content:center;text-align:center}
#contact-title{width:100%;text-align:center}

/* Soft Play controls match the machine catalogue and stay centered independently of the count. */
#soft-play .softplay-browse-bar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;width:100%}
#soft-play .softplay-browse-bar>p{grid-column:1;grid-row:1;justify-self:start}
#soft-play .softplay-controls{grid-column:2;grid-row:1;justify-self:center;justify-content:center;gap:16px}
#soft-play .softplay-controls button{width:62px;height:62px;flex:0 0 62px;font-size:30px;border-width:2px;background:linear-gradient(135deg,#2d1118,#10090c);box-shadow:0 5px 20px #0005;display:grid;place-items:center;padding:0}
#soft-play .softplay-controls button[data-softplay-pause]{font-size:24px}
#soft-play .softplay-controls button:hover:not(:disabled),#soft-play .softplay-controls button:focus-visible{background:#f32635;box-shadow:0 0 24px #f3263540}
@media(max-width:760px){
 #soft-play .softplay-browse-bar{grid-template-columns:minmax(0,1fr);gap:10px}
 #soft-play .softplay-browse-bar>p{grid-column:1;grid-row:1;justify-self:center}
 #soft-play .softplay-controls{grid-column:1;grid-row:2}
 #soft-play .softplay-controls button{width:54px;height:54px;flex-basis:54px;font-size:27px}
 #soft-play .softplay-controls button[data-softplay-pause]{font-size:22px}
}

/* Desktop Soft Play showcase fits the viewport budget; installation cards remain untouched below. No fixed-height clipping. */
@media(min-width:1000px){
 body:not(.product-page) #soft-play{padding-top:24px}
 body:not(.product-page) #soft-play .section-head{gap:12px}
 #soft-play .section-head h2{font-size:clamp(32px,4.6vh,46px);line-height:1.06;margin-top:10px}
 body:not(.product-page) #soft-play .section-head>.softplay-introduction{font-size:18px;line-height:1.45}
 #soft-play .softplay-browse-bar{margin:12px 0}
 #soft-play .softplay-gallery{padding:0 0 4px}
 #soft-play .softplay-project{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:32px}
 #soft-play .softplay-gallery .softplay-visual img{height:clamp(250px,calc(100vh - 360px),500px);width:100%;aspect-ratio:auto;object-fit:contain}
 #soft-play .softplay-gallery .softplay-copy h3{font-size:clamp(26px,3.4vh,34px);margin:0 0 10px;line-height:1.15}
 #soft-play .softplay-copy>p:not(.eyebrow),#soft-play .softplay-features li{font-size:17px;line-height:1.45}
 #soft-play .softplay-features{margin:10px 0}
 #soft-play .softplay-features li{padding-block:5px}
 #soft-play .softplay-copy .line-link{margin-top:10px;padding-block:9px;font-size:13px}
 #soft-play .softplay-selectors{margin-top:10px;gap:12px}
 #soft-play .softplay-selector{font-size:15px;line-height:1.3;padding:10px}
}

/* Header logo removed at the user's request. Retain menu and contact only. */
header{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto;gap:16px 24px;padding-block:18px}
header nav{grid-column:1;grid-row:1;justify-self:stretch;width:100%;max-width:1160px}
header .nav-contact{grid-column:2;grid-row:1;justify-self:end}
@media(max-width:1100px){header{grid-template-columns:minmax(0,1fr) auto;gap:12px 20px}header nav a{font-size:18px}}
@media(max-width:760px){
 header{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;gap:12px;padding-block:14px}
 header nav{grid-column:1;grid-row:1;width:100%;justify-self:center}
 header .nav-contact{grid-column:1;grid-row:2;justify-self:center}
}

/* Center the four navigation tabs against the whole header, not the leftover space beside contact. */
header{grid-template-columns:140px minmax(0,1fr) 140px;grid-template-rows:auto;column-gap:20px}
header nav{grid-column:2;grid-row:1;display:flex;justify-self:center;justify-content:center;align-items:center;flex-wrap:wrap;width:max-content;max-width:100%;gap:8px clamp(24px,3vw,56px)}
header nav a{white-space:nowrap}
header .nav-contact{grid-column:3;grid-row:1;justify-self:end}
@media(max-width:1100px){
 header{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;row-gap:12px}
 header nav{grid-column:1;grid-row:1;width:100%;max-width:100%;justify-self:center;gap:8px 30px}
 header .nav-contact{grid-column:1;grid-row:2;justify-self:center}
}
@media(max-width:760px){
 header nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(100%,520px);gap:4px 12px}
 header nav a{white-space:normal;text-align:center}
}

/* Give machine cutouts the same wide visual column as the Soft Play showcase. */
.machine-catalog .catalog-card-link{grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:clamp(24px,3vw,52px)}
.machine-catalog .catalog-card-visual{width:100%;height:clamp(520px,42vw,760px);padding:0;min-width:0}
.machine-catalog .catalog-card-visual img{width:100%;height:100%;max-width:100%;object-fit:contain}
@media(max-width:1100px) and (min-width:761px){.machine-catalog .catalog-card-visual{height:540px}}
@media(max-width:760px){.machine-catalog .catalog-card-link{display:flex;flex-direction:column;gap:12px}.machine-catalog .catalog-card-visual{height:clamp(380px,110vw,560px);padding:0}}

/* Approved visual service cards. All titles, descriptions and links remain live HTML. */
body:not(.product-page) #hizmetler{background:radial-gradient(ellipse at 20% 0%,#57081a55,transparent 50%),#050505}
#hizmetler .service-list{gap:14px}
#hizmetler .service-card{position:relative;overflow:hidden;padding:0 20px 20px;background:#080808;border:1px solid #f32635;box-shadow:none}
#hizmetler .service-art{flex:none;margin:0 -20px 0;height:clamp(170px,14vw,260px);background-image:url('assets/services-approved.png');background-repeat:no-repeat;position:relative}
#hizmetler .service-art:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#080808)}
#hizmetler .service-card-heading{position:relative;margin:0 0 10px;gap:12px}
#hizmetler .service-card-heading>span{color:#ff2637;font-weight:700;font-size:22px}
#hizmetler .service-card-heading h3{font-size:clamp(21px,1.5vw,28px);font-weight:700}
#hizmetler .service-card>p{font-size:17px;line-height:1.5;color:#efeaed}
#hizmetler .service-project-link{margin-top:12px;font-size:15px}
.project-process-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:48px;padding:22px 0;border-bottom:1px solid #f32635}
.project-process-head .eyebrow{font-size:clamp(22px,2vw,32px);font-weight:700;color:#fff;border-left:5px solid #f32635;padding-left:18px;letter-spacing:0}
.project-process-head h3{font-size:clamp(26px,2.5vw,40px);line-height:1.2;text-align:right}
.installation-panorama{width:100%;aspect-ratio:2172/390;background-image:url('assets/construction-approved.png');background-size:100% auto;background-position:50% 28.14%;border-block:1px solid #f32635}
.project-process{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding:28px 0;margin:0;list-style:none}
.project-process>li{padding:0 24px;background:none;border:0;border-right:1px solid #d32032;min-width:0}
.project-process>li:last-child{border-right:0}
.project-process .project-step-number{color:#ff2637;font:italic 700 42px/1 Chakra,Arial,sans-serif}
.project-process h4{font:700 clamp(22px,1.8vw,32px)/1.2 Chakra,Arial,sans-serif;margin:10px 0 16px}
.project-process p{font-size:18px;line-height:1.55}
.visual-disclaimer{font-size:12px;color:#a39aa0;text-align:right;margin:6px 0 0}
@media(max-width:1100px){#hizmetler .service-art{height:240px}.project-process{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 0}.project-process>li:nth-child(2){border-right:0}.project-process-head{align-items:start}.project-process-head h3{font-size:28px}}
@media(max-width:760px){#hizmetler .service-art{height:230px}.project-process-head{display:block}.project-process-head h3{text-align:left;margin-top:20px}.installation-panorama{aspect-ratio:2172/700;background-size:auto 185.7%;background-position:center 28.14%}.project-process{grid-template-columns:1fr;gap:24px}.project-process>li{padding:0 0 22px;border-right:0;border-bottom:1px solid #d32032}.project-process>li:last-child{border-bottom:0}.project-process p{font-size:18px}.visual-disclaimer{text-align:left}}
#hizmetler .service-art-1{background-size:418.52678571428567% auto;background-position:1.1212333566923616% 26.232114467408586%}
#hizmetler .service-art-2{background-size:418.52678571428567% auto;background-position:33.56692361597757% 26.232114467408586%}
#hizmetler .service-art-3{background-size:418.52678571428567% auto;background-position:66.22284512964261% 25.62111801242236%}
#hizmetler .service-art-4{background-size:418.52678571428567% auto;background-position:98.73861247372109% 25.62111801242236%}
#hizmetler .service-art-5{background-size:309.4059405940594% auto;background-position:1.260835303388495% 80.28616852146264%}
#hizmetler .service-art-6{background-size:315.65656565656565% auto;background-position:50.03903200624512% 80.28616852146264%}
#hizmetler .service-art-7{background-size:312.5% auto;background-position:98.58823529411764% 80.28616852146264%}

/* Lock each art viewport to its approved photo crop so baked-in lettering never appears. */
#hizmetler .service-art-1{height:auto!important;aspect-ratio:448/210}
#hizmetler .service-art-2{height:auto!important;aspect-ratio:448/210}
#hizmetler .service-art-3{height:auto!important;aspect-ratio:448/195}
#hizmetler .service-art-4{height:auto!important;aspect-ratio:448/195}
#hizmetler .service-art-5{height:auto!important;aspect-ratio:606/210}
#hizmetler .service-art-6{height:auto!important;aspect-ratio:594/210}
#hizmetler .service-art-7{height:auto!important;aspect-ratio:600/210}
@media(max-width:760px){.installation-panorama{aspect-ratio:2172/390;background-size:100% auto;background-position:50% 28.14%}}

#hizmetler .section-head h2 .service-heading-accent{color:var(--cyan)}

/* Center and enlarge the existing copyright without changing its wording or year. */
footer.legal-footer{justify-content:center;align-items:center;text-align:center;font-size:clamp(18px,1.55vw,24px);line-height:1.6}
footer.legal-footer>p{width:100%;text-align:center;margin-inline:auto}

/* Give the Soft Play image breathing room before the installation panorama. */
#soft-play .installation-panorama{margin-top:48px}
@media(max-width:760px){#soft-play .installation-panorama{margin-top:32px}}

/* Matching catalogue and Soft Play controls: wider spacing and crisp theme-coloured icons. */
.machine-catalog .catalog-arrows,#soft-play .softplay-controls{gap:36px}
.machine-catalog .catalog-arrows button,#soft-play .softplay-controls button{position:relative;display:grid;place-items:center;font-size:0!important;color:var(--cyan);border-color:#ff657078;background:linear-gradient(145deg,#321019,#10090d);box-shadow:inset 0 1px 0 #ffffff0c,0 5px 18px #0005}
.machine-catalog .catalog-arrows button:before,#soft-play .softplay-controls button:before{content:'';display:block;width:26px;height:26px;background:currentColor;-webkit-mask:var(--control-icon) center/contain no-repeat;mask:var(--control-icon) center/contain no-repeat}
[data-catalog-prev],[data-softplay-prev]{--control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M19%2012H5m7-7-7%207%207%207%22%2F%3E%3C%2Fsvg%3E")}
[data-catalog-next],[data-softplay-next]{--control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M5%2012h14m-7-7%207%207-7%207%22%2F%3E%3C%2Fsvg%3E")}
.catalog-autoplay-toggle,[data-softplay-pause]{--control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Crect%20x%3D%226%22%20y%3D%224%22%20width%3D%224%22%20height%3D%2216%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%224%22%20width%3D%224%22%20height%3D%2216%22%20rx%3D%221%22%2F%3E%3C%2Fsvg%3E")}
.catalog-autoplay-toggle[aria-pressed="true"],[data-softplay-pause][aria-pressed="true"]{--control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M7%204v16l13-8Z%22%2F%3E%3C%2Fsvg%3E")}
.machine-catalog .catalog-arrows button:hover:not(:disabled),#soft-play .softplay-controls button:hover:not(:disabled){color:#fff;border-color:var(--cyan)}
@media(max-width:760px){.machine-catalog .catalog-arrows,#soft-play .softplay-controls{gap:28px}.machine-catalog .catalog-arrows button:before,#soft-play .softplay-controls button:before{width:24px;height:24px}}
@media(forced-colors:active){.machine-catalog .catalog-arrows button,#soft-play .softplay-controls button{font-size:24px!important}.machine-catalog .catalog-arrows button:before,#soft-play .softplay-controls button:before{display:none}}

.machine-catalog .catalog-arrows button.catalog-autoplay-toggle{font-size:0!important}
@media(forced-colors:active){.machine-catalog .catalog-arrows button.catalog-autoplay-toggle{font-size:24px!important}}

/* Direct SVGs replace CSS masks; actual paths render without mask support. */
.machine-catalog .catalog-arrows,#soft-play .softplay-controls{gap:48px}
.machine-catalog .catalog-arrows button:before,#soft-play .softplay-controls button:before{display:none!important}
.machine-catalog .catalog-arrows button svg[data-control-icon],#soft-play .softplay-controls button svg[data-control-icon]{display:block;width:28px;height:28px;pointer-events:none}
.machine-catalog .catalog-arrows button,#soft-play .softplay-controls button{color:var(--cyan);border:2px solid #ff6871a6;box-shadow:0 0 16px #ff263724,inset 0 1px 0 #ffffff10}
@media(max-width:760px){.machine-catalog .catalog-arrows,#soft-play .softplay-controls{gap:32px}}
@media(forced-colors:active){.machine-catalog .catalog-arrows button svg[data-control-icon],#soft-play .softplay-controls button svg[data-control-icon]{display:none}}

/* Quiet, balanced 24px navigation icons. Flex centers the SVG independently of legacy text nodes. */
.machine-catalog .catalog-arrows button,#soft-play .softplay-controls button{display:flex;align-items:center;justify-content:center;gap:0;padding:0;line-height:0;color:#f5f2f8;background:#130d10;border:1px solid #b83b485c;box-shadow:none}
.machine-catalog .catalog-arrows button svg[data-control-icon],#soft-play .softplay-controls button svg[data-control-icon]{width:24px;height:24px;flex:0 0 24px;margin:0;overflow:visible}
.machine-catalog .catalog-arrows button:hover:not(:disabled),#soft-play .softplay-controls button:hover:not(:disabled){color:#fff;background:#351118;border-color:#ff6871;box-shadow:none}
.machine-catalog .catalog-arrows button:focus-visible,#soft-play .softplay-controls button:focus-visible{outline:2px solid #ff6871;outline-offset:5px;background:#351118;box-shadow:none}
@media(forced-colors:active){.machine-catalog .catalog-arrows button svg[data-control-icon],#soft-play .softplay-controls button svg[data-control-icon]{display:none}}

/* Compact mobile header: four links on one line, contact centered below. */
@media(max-width:760px){
 body>header{height:auto;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;margin-inline:12px;padding:6px 0 8px;gap:2px}
 body>header nav{grid-column:1;grid-row:1;display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;width:100%;max-width:none;gap:4px}
 body>header nav a{font-size:clamp(11px,3.1vw,15px);line-height:1.2;letter-spacing:0;white-space:nowrap;padding:10px 0;min-height:40px;display:flex;align-items:center}
 body>header .nav-contact{grid-column:1;grid-row:2;justify-self:center;font-size:13px;line-height:1.2;padding:9px 16px;gap:14px;min-height:38px}
}