/* Önal Pleksi — pleksi.biz.tr
   Fikir: akrilik levha. Düz, net yüzeyler; ince çizgiler; ışığı kıran tek bir "kenar" (logodaki spektrum). */
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url("/fontlar/archivo-latin-ext.woff2") format("woff2");unicode-range:U+011E-011F,U+0130,U+015E-015F,U+20BA}
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url("/fontlar/archivo-latin.woff2") format("woff2");unicode-range:U+0020-007E,U+00A0-00FF,U+0131,U+2013-2014,U+2018-2019,U+201C-201D,U+2022,U+2026,U+2082,U+2212}

:root{
  --sheet:#f4f7f8; --white:#fff; --ink:#15262c; --muted:#4f6269; --line:#d3dde1; --line-2:#e6ecef;
  --petrol:#0c3640; --petrol-2:#124855; --teal:#0a7c75; --teal-ink:#075e59; --mint:#e3f3f1; --amber:#ffb000;
  --edge:linear-gradient(90deg,#ffd500 0%,#ff8a00 22%,#e5007d 44%,#7b3ff2 62%,#009fe3 80%,#79c142 100%);
  --wrap:1220px; --gut:clamp(1.1rem,4vw,2.5rem);
  --f:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --s1:.5rem;--s2:.75rem;--s3:1rem;--s4:1.5rem;--s5:2rem;--s6:3rem;--s7:4.5rem;--s8:6.5rem;
  --t-sm:.875rem;--t-base:1.0625rem;--t-lg:1.25rem;--t-xl:clamp(1.45rem,1.1rem + 1.2vw,1.95rem);--t-2xl:clamp(1.85rem,1.2rem + 2.4vw,2.9rem);--t-hero:clamp(2.2rem,1.1rem + 3.6vw,3.75rem);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:6rem}
body{margin:0;font-family:var(--f);font-size:var(--t-base);line-height:1.62;color:var(--ink);background:var(--white);font-stretch:100%;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-stretch:112%;font-weight:650;line-height:1.12;letter-spacing:-.012em;text-wrap:balance}
h1{font-size:var(--t-2xl)} h2{font-size:var(--t-xl)} h3{font-size:var(--t-lg);line-height:1.25}
p{max-width:68ch;text-wrap:pretty}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px;border-radius:2px}
::selection{background:var(--petrol);color:#fff}
[hidden]{display:none!important}
.wrap{width:min(var(--wrap),100% - 2*var(--gut));margin-inline:auto}
.skip{position:absolute;left:1rem;top:-5rem;z-index:99;background:var(--ink);color:#fff;padding:.75rem 1rem}
.skip:focus{top:1rem}
.muted{color:var(--muted)} .small{font-size:var(--t-sm)}
.link{color:var(--teal-ink);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.link:hover{text-decoration-thickness:2px}

/* Üst bant */
.head{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.head::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:var(--edge)}
.head .wrap{display:flex;align-items:center;gap:var(--s4);min-height:76px}
.logo{flex:none;display:block}
.logo img{height:56px;width:auto}
.nav{display:flex;gap:clamp(.9rem,1.8vw,1.7rem);margin-left:auto;font-weight:550;font-size:1rem}
.nav a{padding:.5rem 0;border-bottom:2px solid transparent}
.nav a:hover{border-color:var(--line)}
.nav a[aria-current]{border-color:var(--teal);color:var(--teal-ink)}
.head-tel{font-weight:650;font-stretch:108%;white-space:nowrap;font-variant-numeric:tabular-nums}
.head-tel:hover{color:var(--teal-ink)}
.menu-btn{display:none;margin-left:auto;background:none;border:1px solid var(--line);border-radius:3px;padding:.55rem .85rem;font-weight:600;cursor:pointer}

/* Düğmeler */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:.7rem 1.35rem;border-radius:3px;font-weight:650;font-stretch:106%;border:1.5px solid var(--petrol);background:var(--petrol);color:#fff;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn:hover{background:var(--teal);border-color:var(--teal)}
.btn.ghost{background:transparent;color:var(--petrol)}
.btn.ghost:hover{background:var(--petrol);color:#fff;border-color:var(--petrol)}
.btn.on-dark{background:#fff;color:var(--petrol);border-color:#fff}
.btn.on-dark:hover{background:var(--amber);border-color:var(--amber);color:var(--ink)}
.btn.ghost.on-dark{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn.ghost.on-dark:hover{background:#fff;color:var(--petrol)}
.btn.sm{min-height:42px;padding:.5rem 1rem;font-size:.95rem}
.btns{display:flex;flex-wrap:wrap;gap:var(--s2)}

/* Bölümler */
.sec{padding-block:var(--s7)}
.sec.tint{background:var(--sheet);border-block:1px solid var(--line-2)}
.sec.dark{background:var(--petrol);color:#fff}
.sec.dark .muted{color:#b9cfd3}
.sec-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:var(--s3) var(--s5);margin-bottom:var(--s5)}
.sec-head p{margin-top:var(--s2);color:var(--muted)}
.sec.dark .sec-head p{color:#b9cfd3}

/* Açılış */
.hero{background:var(--sheet);border-bottom:1px solid var(--line);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--s6);align-items:center;padding-block:var(--s7) var(--s7)}
.hero h1{font-size:var(--t-hero);font-stretch:114%;font-weight:700;line-height:1.02;letter-spacing:-.022em}
.hero .lede{margin-top:var(--s4);font-size:var(--t-lg);line-height:1.5;color:var(--muted);max-width:44ch}
.hero .btns{margin-top:var(--s5)}
.hero-note{margin-top:var(--s4);font-size:var(--t-sm);color:var(--muted)}
.stack{position:relative;aspect-ratio:1/1.02;max-width:560px;justify-self:end;width:100%}
.stack figure{position:absolute;background:#fff;padding:7px;border:1px solid var(--line);box-shadow:0 18px 40px -22px rgba(12,54,64,.55)}
.stack figure::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-4px;height:4px;background:var(--edge)}
.stack img{width:100%;height:100%;object-fit:cover}
.stack .a{inset:0 14% 26% 0}
.stack .b{inset:38% 0 4% 46%}
.stack .c{inset:60% 58% 0 6%}
@media (prefers-reduced-motion:no-preference){
  .stack figure{animation:sheet .7s cubic-bezier(.2,.7,.2,1) both}
  .stack .b{animation-delay:.12s}.stack .c{animation-delay:.24s}
  @keyframes sheet{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);background:#fff}
.facts div{padding:var(--s4) var(--s4) var(--s4) 0;border-right:1px solid var(--line-2)}
.facts div+div{padding-left:var(--s4)}
.facts div:last-child{border-right:0}
.facts dt{font-weight:650;font-stretch:108%}
.facts dd{color:var(--muted);font-size:var(--t-sm);margin-top:.15rem}

/* Sayfa başlığı */
.page-head{background:var(--sheet);border-bottom:1px solid var(--line);padding-block:var(--s5) var(--s6)}
.crumbs{display:flex;flex-wrap:wrap;gap:.4rem;font-size:var(--t-sm);color:var(--muted);margin-bottom:var(--s4)}
.crumbs li+li::before{content:"/";margin-right:.4rem;color:var(--line)}
.crumbs a:hover{color:var(--teal-ink);text-decoration:underline}
.page-head h1{max-width:22ch}
.page-head .lede{margin-top:var(--s3);font-size:var(--t-lg);line-height:1.5;color:var(--muted);max-width:60ch}

/* Ürün karoları */
.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s4)}
.tile{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);position:relative;transition:border-color .15s}
.tile::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-1px;height:3px;background:var(--edge);opacity:0;transition:opacity .15s}
.tile:hover{border-color:var(--ink)} .tile:hover::after,.tile:focus-visible::after{opacity:1}
.tile img{aspect-ratio:4/3;object-fit:cover;width:100%;background:var(--sheet)}
.tile div{padding:var(--s3) var(--s3) var(--s4)}
.tile h3{font-size:1.1rem}
.tile p{font-size:var(--t-sm);color:var(--muted);margin-top:.3rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:var(--s5)}
.chips a{border:1px solid var(--line);background:#fff;padding:.4rem .8rem;border-radius:3px;font-size:.95rem;font-weight:550}
.chips a:hover{border-color:var(--ink)}

/* Hizmet satırları */
.rows{border-top:1px solid var(--line)}
.rows a{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) auto;gap:var(--s4);align-items:baseline;padding:var(--s3) 0;border-bottom:1px solid var(--line)}
.rows a:hover strong{color:var(--teal-ink);text-decoration:underline;text-underline-offset:.2em}
.rows strong{font-size:var(--t-lg);font-stretch:110%;font-weight:650}
.rows span{color:var(--muted)}
.rows em{font-style:normal;font-size:var(--t-sm);font-weight:600;color:var(--teal-ink);white-space:nowrap}
.sec.dark .rows,.sec.dark .rows a{border-color:rgba(255,255,255,.2)}
.sec.dark .rows span{color:#b9cfd3}.sec.dark .rows em{color:var(--amber)}.sec.dark .rows a:hover strong{color:#fff}

.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s6);align-items:start}
.two.wide-l{grid-template-columns:minmax(0,1.5fr) minmax(0,.9fr)}

/* Tanım kutusu (kısa yanıt) */
.answer{border:1px solid var(--line);border-left:4px solid var(--teal);background:var(--mint);padding:var(--s4);font-size:var(--t-lg);line-height:1.5}
.answer b{display:block;font-size:var(--t-sm);font-weight:650;color:var(--teal-ink);margin-bottom:.35rem}
.answer p{max-width:none}

/* Özellik tablosu */
.spec{width:100%;border-collapse:collapse;font-size:1rem}
.spec caption{text-align:left;font-weight:650;font-stretch:110%;font-size:var(--t-lg);padding-bottom:var(--s2)}
.spec th,.spec td{text-align:left;vertical-align:top;padding:.65rem 0;border-top:1px solid var(--line)}
.spec th{width:40%;font-weight:600;padding-right:var(--s3)}
.spec td{color:var(--muted)}
.spec tr:last-child th,.spec tr:last-child td{border-bottom:1px solid var(--line)}

/* Süreç */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s4);counter-reset:s}
.steps li{counter-increment:s;border-top:2px solid var(--ink);padding-top:var(--s3)}
.steps li::before{content:counter(s);display:block;font-stretch:120%;font-weight:700;font-size:var(--t-xl);line-height:1;margin-bottom:var(--s2);color:var(--teal)}
.steps strong{display:block;font-stretch:108%}
.steps span{color:var(--muted);font-size:var(--t-sm)}

/* Referans listesi */
.refs{display:flex;flex-wrap:wrap;gap:.6rem 2rem;font-stretch:112%;font-weight:600;font-size:var(--t-lg)}
.refs li{padding-left:1rem;position:relative}
.refs li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;background:var(--teal)}

/* Rehber kartları */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4)}
.card{display:block;border:1px solid var(--line);background:#fff;padding:var(--s4);transition:border-color .15s}
.card:hover{border-color:var(--ink)}
.card small{color:var(--teal-ink);font-weight:600}
.card h3{margin-top:.4rem;font-size:1.15rem}
.card p{margin-top:.5rem;color:var(--muted);font-size:var(--t-sm)}

/* SSS */
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:var(--s3);padding:var(--s3) 0;font-weight:650;font-stretch:106%;font-size:1.1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font-weight:400;font-size:1.5rem;line-height:1;color:var(--teal)}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 0 var(--s4);color:var(--muted)}
.faq summary h2,.faq summary h3{font:inherit;margin:0;letter-spacing:0;display:block}

/* İçerik gövdesi */
.prose>*+*{margin-top:var(--s3)}
.prose h2{margin-top:var(--s6)}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:var(--s5)}
.prose ul{display:grid;gap:.5rem}
.prose ul li{position:relative;padding-left:1.4rem;max-width:66ch}
.prose ul li::before{content:"";position:absolute;left:.15rem;top:.68em;width:7px;height:7px;border:2px solid var(--teal)}
.checks{display:grid;gap:0;border-top:1px solid var(--line)}
.checks div{display:grid;grid-template-columns:11.5rem minmax(0,1fr);gap:var(--s3);padding:.75rem 0;border-bottom:1px solid var(--line)}
.checks dt{font-weight:650}
.checks dd{color:var(--muted)}

/* Galeri */
.gal{display:grid;gap:var(--s2)}
.gal .main{border:1px solid var(--line);background:var(--sheet);padding:7px;position:relative}
.gal .main::after{content:"";position:absolute;left:-1px;right:-1px;bottom:-4px;height:4px;background:var(--edge)}
.gal .main img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#fff}
.gal .thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2);margin-top:var(--s2)}
.gal .thumbs img{aspect-ratio:4/3;object-fit:cover;width:100%;border:1px solid var(--line)}
.gal figcaption{font-size:var(--t-sm);color:var(--muted);margin-top:.6rem}

/* Yan teklif kutusu */
.aside{position:sticky;top:6.5rem;border:1px solid var(--line);background:var(--sheet);padding:var(--s4)}
.aside h2{font-size:var(--t-lg)}
.aside ul{margin-top:var(--s3);display:grid;gap:.45rem}
.aside .btn{width:100%;margin-top:var(--s3)}
.aside .tel{display:block;font-weight:650;font-stretch:108%;font-size:var(--t-lg);font-variant-numeric:tabular-nums}
.aside .tel:hover{color:var(--teal-ink)}

/* Mozaik (referans galerisi) */
.mosaic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s2)}
.mosaic img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid var(--line)}

/* Teklif bandı */
.cta{background:var(--petrol);color:#fff;position:relative}
.cta::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--edge)}
.cta .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--s6);padding-block:var(--s7);align-items:center}
.cta p{color:#b9cfd3;margin-top:var(--s2)}
.cta .btns{margin-top:var(--s4)}
.nap{font-style:normal;display:grid;gap:.35rem;border-left:1px solid rgba(255,255,255,.25);padding-left:var(--s5)}
.nap strong{font-stretch:112%;font-size:var(--t-lg)}
.nap a:hover{color:var(--amber)}
.nap .t{font-weight:650;font-variant-numeric:tabular-nums}

/* Alt bilgi */
.foot{background:#08262d;color:#c5d6d9;font-size:.97rem}
.foot .wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:var(--s5);padding-block:var(--s6)}
.foot h2{font-size:1rem;color:#fff;margin-bottom:var(--s2);font-stretch:108%}
.foot li+li{margin-top:.35rem}
.foot a:hover{color:#fff;text-decoration:underline}
.foot address{font-style:normal}
.foot-logo{background:#fff;display:inline-block;padding:.5rem .7rem;border-radius:3px;margin-bottom:var(--s3)}
.foot-logo img{height:38px;width:auto}
.foot-b{border-top:1px solid rgba(255,255,255,.14)}
.foot-b .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2);padding-block:var(--s3);grid-template-columns:none}

/* Form */
.form{display:grid;gap:var(--s3)}
.form .g2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.form label{display:grid;gap:.3rem;font-weight:600;font-size:.97rem}
.form input,.form select,.form textarea{width:100%;border:1px solid #9fb0b6;border-radius:3px;padding:.7rem .8rem;background:#fff;font-weight:400}
.form textarea{min-height:8.5rem;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:3px solid var(--amber);outline-offset:1px;border-color:var(--ink)}
.form .check{display:flex;gap:.6rem;align-items:flex-start;font-weight:400}
.form .check input{width:1.15rem;height:1.15rem;margin-top:.25rem;flex:none}
.result{border:1px solid var(--teal);background:var(--mint);padding:var(--s4);margin-top:var(--s4)}
.result pre{white-space:pre-wrap;font-family:inherit;font-size:.97rem;background:#fff;border:1px solid var(--line);padding:var(--s3);margin:var(--s3) 0;max-height:16rem;overflow:auto}
.map{width:100%;aspect-ratio:16/10;border:1px solid var(--line);display:block}
.contact-list{display:grid;gap:var(--s4)}
.contact-list dt{font-size:var(--t-sm);color:var(--muted)}
.contact-list dd{font-size:var(--t-lg);font-weight:600}
.contact-list dd a:hover{color:var(--teal-ink);text-decoration:underline}
.sitemap{columns:3;column-gap:var(--s5)}
.sitemap section{break-inside:avoid;margin-bottom:var(--s5)}
.sitemap h2{font-size:var(--t-lg);margin-bottom:var(--s2)}
.sitemap li+li{margin-top:.3rem}
.sitemap a:hover{color:var(--teal-ink);text-decoration:underline}
.meta-line{font-size:var(--t-sm);color:var(--muted);margin-top:var(--s3)}

@media (max-width:1000px){
  .tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .foot .wrap{grid-template-columns:1fr 1fr}
  .head-tel{display:none}
}
@media (max-width:860px){
  .menu-btn{display:block}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:var(--s2) var(--gut) var(--s4);margin:0}
  .nav.open{display:flex}
  .nav a{padding:.8rem 0;border-bottom:1px solid var(--line-2)}
  .head .btn{display:none}
  .hero-grid,.two,.two.wide-l,.cta .wrap{grid-template-columns:minmax(0,1fr)}
  .stack{justify-self:start;max-width:480px}
  .facts,.steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts div:nth-child(2){border-right:0}.facts div:nth-child(3){padding-left:0}
  .facts div:nth-child(n+3){border-top:1px solid var(--line-2)}
  .cards{grid-template-columns:minmax(0,1fr)}
  .rows a{grid-template-columns:minmax(0,1fr)}.rows a{gap:.2rem}
  .aside{position:static}
  .nap{border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.25);padding-top:var(--s4)}
  .mosaic{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sitemap{columns:2}
  .sec{padding-block:var(--s6)}
}
@media (max-width:560px){
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
  .tile p{display:none}
  .foot .wrap,.form .g2{grid-template-columns:minmax(0,1fr)}
  .checks div{grid-template-columns:minmax(0,1fr);gap:.1rem}
  .logo img{height:38px}
  .mosaic{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sitemap{columns:1}
  .btns .btn{flex:1 1 100%}
}
@media print{.head,.cta,.foot,.aside,.menu-btn{display:none}body{font-size:11pt}}