:root{
    --paper:#FFFFFF;--ink:#0A0A0A;--gray:#565656;--faint:#8C8C8C;--hair:#E4E4E4;--mist:#F6F6F6;
    --pad:clamp(20px,4.5vw,72px);--ease:cubic-bezier(.2,.6,.2,1);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{background:var(--paper);color:var(--ink);font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:16px;line-height:1.58;-webkit-font-smoothing:antialiased;overflow-x:hidden;width:100%}
  a{color:inherit;text-decoration:none}
  h1,h2,h3{font-family:"Space Grotesk",sans-serif;font-weight:700;letter-spacing:-.025em;line-height:1.02}
  ::selection{background:var(--ink);color:var(--paper)}
  code,.mono{font-family:"IBM Plex Mono",monospace}
  .pad{padding-left:var(--pad);padding-right:var(--pad)}

  /* ALTERNATING SECTION SCHEME — dark sections flip the core variables so every
     component (built on --paper/--ink/--gray/--faint/--hair/--mist) auto-inverts */
  .dark{
    --paper:#0A0A0A;--ink:#FFFFFF;--gray:#B4B4B4;--faint:#7C7C7C;--hair:#262626;--mist:#161616;
    background:#0A0A0A;color:#FFFFFF;
  }

  .eyebrow{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);display:inline-flex;align-items:center;gap:10px;font-weight:500}
  .eyebrow::before{content:"["}.eyebrow::after{content:"]"}

  .btn{display:inline-flex;align-items:center;gap:10px;font-family:"Space Grotesk",sans-serif;font-weight:600;font-size:14.5px;padding:13px 22px;border:1.5px solid var(--ink);cursor:pointer;transition:transform .14s var(--ease),box-shadow .14s var(--ease),background .14s,color .14s;white-space:nowrap;border-radius:0}
  .btn-primary{background:var(--ink);color:var(--paper)}
  .btn-primary:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}
  .btn-ghost{background:var(--paper);color:var(--ink)}
  .btn-ghost:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}

  /* STATUS RIBBON */
  .ribbon{display:flex;align-items:center;justify-content:space-between;gap:16px;height:30px;border-bottom:1px solid var(--hair);font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray)}
  .ribbon .l,.ribbon .r{display:flex;align-items:center;gap:18px;overflow:hidden;white-space:nowrap}
  .ribbon .dot{width:7px;height:7px;background:var(--ink);display:inline-block;animation:pulse 1.6s steps(2) infinite}
  @keyframes pulse{50%{opacity:.2}}
  .ribbon b{color:var(--ink);font-weight:600}
  @media(max-width:760px){.ribbon .r span.hideS{display:none}}

  /* NAV */
  header.nav{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:1.5px solid var(--ink)}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;height:66px;gap:24px}
  .brand{display:flex;align-items:center;gap:12px;font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:19px;letter-spacing:-.02em}
  .brand .glyph{height:32px;width:auto;display:block}
  .nav-links{display:flex;gap:30px;align-items:center}
  .nav-links a{font-family:"IBM Plex Mono",monospace;font-size:13px;color:var(--gray);transition:color .15s;text-transform:lowercase}
  .nav-links a:hover{color:var(--ink)}
  .nav-right{display:flex;align-items:center;gap:14px}
  /* language switch */
  .lang{display:inline-flex;align-items:stretch;border:1.5px solid var(--ink);font-family:"IBM Plex Mono",monospace;font-size:12.5px;letter-spacing:.06em}
  .lang button{background:var(--paper);border:none;padding:8px 12px;cursor:pointer;color:var(--faint);font:inherit;transition:.14s}
  .lang button+button{border-left:1.5px solid var(--ink)}
  .lang button.active{background:var(--ink);color:var(--paper)}
  .lang button:hover:not(.active){background:var(--mist);color:var(--ink)}
  .socials{display:inline-flex;align-items:center;gap:2px;margin:0 4px;padding:0 4px;border-left:1.5px solid var(--hair);border-right:1.5px solid var(--hair)}
  .soc{width:34px;height:34px;display:flex;align-items:center;justify-content:center;color:var(--faint);transition:color .15s var(--ease),transform .15s var(--ease)}
  .soc:hover{color:var(--ink);transform:translateY(-2px)}
  .soc svg{width:18px;height:18px;display:block}
  .nav-right{gap:12px}
  .nav-right .btn-primary{padding:11px 20px;letter-spacing:.01em}
  .nav-right .btn-primary::after{content:"→";font-family:"IBM Plex Mono",monospace;transition:transform .16s var(--ease)}
  .nav-right .btn-primary:hover::after{transform:translateX(3px)}
  header.nav{transition:box-shadow .22s var(--ease)}
  header.nav.scrolled{box-shadow:0 7px 26px rgba(10,10,10,.09)}
  .menu-btn{display:none;background:var(--paper);border:1.5px solid var(--ink);color:var(--ink);width:42px;height:40px;cursor:pointer;font-size:18px}

  /* CROSSHAIR */
  .crosshair{position:fixed;inset:0;z-index:40;pointer-events:none;display:none}
  .crosshair .vx,.crosshair .hz{position:absolute;background:#808080;opacity:.28}
  .crosshair .vx{width:1px;height:100%;top:0}.crosshair .hz{height:1px;width:100%;left:0}
  .crosshair .coord{position:absolute;font-family:"IBM Plex Mono",monospace;font-size:10px;color:var(--ink);background:var(--paper);padding:2px 5px;border:1px solid var(--ink);transform:translate(12px,12px)}

  /* HERO */
  .hero{position:relative;border-bottom:1.5px solid var(--ink);min-height:calc(100vh - 96px);display:flex;align-items:center;overflow:hidden;background:#000}
  .hero-fx{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none}
  .hero-stage{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(24px,8vw,160px);width:100%;padding:clamp(36px,6vh,72px) var(--pad)}
  .hero-side{display:flex;flex-direction:column;gap:24px;max-width:30em}
  .hero-left{justify-self:start;align-items:flex-start;text-align:left}
  .hero-right{justify-self:end;align-items:flex-end;text-align:right}
  .hero h1{font-size:clamp(27px,3.2vw,50px);margin:16px 0 0;text-transform:uppercase;letter-spacing:-.035em;line-height:1.0}
  .hero h1 .outline{color:transparent;-webkit-text-stroke:1.5px var(--ink);display:inline-block}
  .hero-lead{font-size:clamp(15px,1.2vw,17px);color:var(--gray);max-width:26em;line-height:1.62}
  .hero-cta{display:flex;gap:14px;flex-wrap:wrap;justify-content:flex-end}
  .hero-meta{display:flex;border:1.5px solid var(--ink)}
  .hero-meta div{border-right:1.5px solid var(--ink);padding:13px 18px;text-align:left}
  .hero-meta div:last-child{border-right:none}
  .hero-meta b{display:block;font-family:"Space Grotesk",sans-serif;font-size:23px;font-weight:700;letter-spacing:-.03em}
  .hero-meta span{font-family:"IBM Plex Mono",monospace;font-size:10px;color:var(--gray);text-transform:uppercase;letter-spacing:.08em}
  .hero-cat-wrap{position:absolute;inset:0;z-index:1;display:flex;align-items:flex-end;justify-content:center;pointer-events:none;will-change:transform}
  .hero-cat{width:auto;height:auto;max-width:clamp(420px,55vw,920px);max-height:100%;display:block;filter:drop-shadow(0 0 90px rgba(46,98,224,.5))}

  .hero-core{position:relative;overflow:hidden;background:var(--paper)}
  #core{display:block;width:100%;height:100%;opacity:.42}
  .hero-focus{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;pointer-events:none}
  .hf-tick{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(96%,620px);height:min(96%,620px);z-index:0}
  .hf-tick::before,.hf-tick::after{content:"";position:absolute;background:var(--hair)}
  .hf-tick::before{left:0;right:0;top:50%;height:1px}
  .hf-tick::after{top:0;bottom:0;left:50%;width:1px}
  .hf-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:1.5px solid var(--ink);border-radius:50%;z-index:1}
  .hf-ring.r1{width:min(72%,440px);aspect-ratio:1;opacity:.5}
  .hf-ring.r2{width:min(92%,560px);aspect-ratio:1;border-style:dashed;opacity:.3;animation:spin 46s linear infinite}
  .hf-img{position:relative;z-index:3;width:min(54%,330px);aspect-ratio:1;object-fit:cover;display:block;border:1.5px solid var(--ink);box-shadow:0 0 0 7px var(--paper),0 26px 70px rgba(18,52,170,.42),0 0 64px rgba(46,96,220,.32);transition:transform .6s var(--ease)}
  .hero-core:hover .hf-img{transform:scale(1.03)}
  @keyframes spin{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
  .hud{position:absolute;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gray)}
  .hud.tl{top:18px;left:18px}.hud.tr{top:18px;right:18px;text-align:right}.hud.bl{bottom:18px;left:18px}.hud.br{bottom:18px;right:18px;text-align:right}
  .hud b{color:var(--ink)}
  .bracket{position:absolute;width:22px;height:22px;border:1.5px solid var(--ink)}
  .bracket.tl{top:14px;left:14px;border-right:none;border-bottom:none}
  .bracket.tr{top:14px;right:14px;border-left:none;border-bottom:none}
  .bracket.bl{bottom:14px;left:14px;border-right:none;border-top:none}
  .bracket.br{bottom:14px;right:14px;border-left:none;border-top:none}
  .core-cap{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);border:1.5px solid var(--ink);padding:5px 12px;background:var(--paper);white-space:nowrap}

  /* TICKER */
  .ticker{border-bottom:1.5px solid var(--ink);background:var(--ink);color:#fff;overflow:hidden;height:42px;display:flex;align-items:center}
  .ticker-track{display:flex;white-space:nowrap;animation:scroll 30s linear infinite;font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.05em}
  .ticker:hover .ticker-track{animation-play-state:paused}
  .ticker-track span{padding:0 22px;display:inline-flex;align-items:center;gap:8px;border-right:1px solid #2c2c2c}
  .ticker-track span i{font-style:normal;color:#9a9a9a}
  @keyframes scroll{to{transform:translateX(-50%)}}

  /* SECTION */
  section.block{border-bottom:1.5px solid var(--ink)}
  .sec-head{padding:clamp(56px,8vh,96px) var(--pad) 0;max-width:1000px}
  .sec-head h2{font-size:clamp(28px,4.2vw,54px);margin-top:18px;text-transform:uppercase;letter-spacing:-.03em}
  .sec-head p{color:var(--gray);font-size:17px;margin-top:18px;max-width:50em}
  .sec-index{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--faint);float:right;letter-spacing:.1em}

  .grid-full{display:grid;border-top:1.5px solid var(--ink);margin-top:clamp(40px,6vh,72px)}
  .cell{border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);padding:30px var(--pad);background:var(--paper);position:relative}

  .cap-grid{grid-template-columns:repeat(3,1fr)}
  .cap{transition:background .15s var(--ease)}
  .cap:hover{background:var(--ink);color:var(--paper)}
  .cap:hover p{color:var(--paper);opacity:.72}.cap:hover .ic{border-color:var(--paper)}.cap:hover .ic svg{stroke:var(--paper)}
  .cap:hover .tags i{border-color:var(--paper);color:var(--paper)}.cap:hover .num{color:var(--paper);opacity:.55}
  .cap .num{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--faint);margin-bottom:18px}
  .cap .ic{width:44px;height:44px;border:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
  .cap .ic svg{width:21px;height:21px;stroke:var(--ink);fill:none;stroke-width:1.7}
  .cap h3{font-size:19px;text-transform:uppercase}
  .cap p{color:var(--gray);font-size:14.5px;margin-top:10px}
  .cap .tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
  .cap .tags i{font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--gray);border:1px solid var(--ink);padding:3px 8px}

  /* SERVICES — alternating left/right rows with 3D scene panels */
  .svc-rows{border-top:1.5px solid var(--ink);margin-top:clamp(40px,6vh,72px)}
  .srow{display:grid;grid-template-columns:1.05fr .95fr;border-bottom:1.5px solid var(--ink);min-height:clamp(340px,48vh,500px)}
  .srow .media{position:relative;overflow:hidden;border-right:1.5px solid var(--ink);background-image:linear-gradient(var(--hair) 1px,transparent 1px),linear-gradient(90deg,var(--hair) 1px,transparent 1px);background-size:40px 40px}
  .srow .body{padding:clamp(32px,5vh,64px) var(--pad);display:flex;flex-direction:column;justify-content:center}
  .srow:nth-child(even) .media{order:2;border-right:none;border-left:1.5px solid var(--ink)}
  .srow:nth-child(even) .body{order:1}
  .scene{display:block;width:100%;height:100%;cursor:crosshair}
  .srow .media-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:clamp(22px,4vh,48px);display:block;transition:transform .7s var(--ease)}
  .srow:hover .media-img{transform:scale(1.03)}
  /* featured service row — orta çizgi üstünde yüzen görsel */
  .srow.feat{position:relative;grid-template-columns:.92fr 1.08fr}
  .srow.feat .media{overflow:hidden;order:0;border-right:none;border-left:none}
  .srow.feat .svc-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;opacity:.9;transition:opacity .4s var(--ease)}
  .srow.feat:hover .svc-canvas{opacity:1}
  .srow.feat .body{order:1}
  .srow.feat .feat-img{position:absolute;top:50%;left:23%;transform:translate(-50%,-50%);height:clamp(280px,90%,520px);width:auto;z-index:6;object-fit:contain;pointer-events:none;filter:drop-shadow(0 0 44px rgba(96,140,220,.30));-webkit-mask:radial-gradient(80% 92% at 50% 50%,#000 66%,transparent 98%);mask:radial-gradient(80% 92% at 50% 50%,#000 66%,transparent 98%);transition:transform .7s var(--ease)}
  .srow.feat:hover .feat-img{transform:translate(-50%,-50%) scale(1.035)}
  .srow.feat .bracket.tr,.srow.feat .bracket.br{display:none}
  .srow.feat .feat-ring{position:absolute;top:50%;left:23%;width:clamp(300px,44vh,540px);aspect-ratio:1;transform:translate(-50%,-50%) rotate(-12deg);border:1px solid rgba(255,255,255,.10);border-radius:50%;z-index:5;pointer-events:none}
  .srow.feat .feat-ring::after{content:"";position:absolute;inset:9%;border:1px dashed rgba(116,150,214,.22);border-radius:50%}
  .srow.feat .feat-cap{position:absolute;left:23%;bottom:18px;transform:translateX(-50%);z-index:7;white-space:nowrap;font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray);background:rgba(10,10,10,.62);border:1.5px solid var(--ink);padding:6px 13px}
  .srow.feat .feat-cap b{color:var(--ink);font-weight:600}
  .srow.feat .scene-label{display:none}
  /* çift satırlar: görsel ve düzen aynalanır (bir sol, bir sağ) */
  .srow.feat:nth-child(even){grid-template-columns:1.08fr .92fr}
  .srow.feat:nth-child(even) .media{order:2}
  .srow.feat:nth-child(even) .body{order:1}
  .srow.feat:nth-child(even) .feat-img,.srow.feat:nth-child(even) .feat-ring,.srow.feat:nth-child(even) .feat-cap{left:77%}
  .srow.feat:nth-child(even) .bracket.tr,.srow.feat:nth-child(even) .bracket.br{display:block}
  .srow.feat:nth-child(even) .bracket.tl,.srow.feat:nth-child(even) .bracket.bl{display:none}
  .srow.feat .body .kline{display:flex;align-items:center;gap:11px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gray);margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--hair)}
  .srow.feat .body .kline .dot{width:7px;height:7px;background:var(--ink);display:inline-block;flex:none;animation:pulse 1.6s steps(2) infinite}
  .srow.feat .body .kline .kpos{margin-left:auto;color:var(--faint)}
  .snum{font-family:"Space Grotesk",sans-serif;font-size:clamp(28px,4vw,46px);font-weight:700;-webkit-text-stroke:1.4px var(--ink);color:transparent;line-height:1;margin-bottom:16px}
  .srow .body h3{font-size:clamp(20px,2.7vw,30px);text-transform:uppercase;letter-spacing:-.02em}
  .srow .body p{color:var(--gray);font-size:15.5px;margin-top:12px;max-width:34em}
  .srow .body .tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}
  .srow .body .tags i{font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--gray);border:1px solid var(--ink);padding:4px 9px}
  .scene-label{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);border:1.5px solid var(--ink);padding:4px 11px;background:var(--paper);white-space:nowrap}
  .proc-grid{grid-template-columns:repeat(4,1fr)}
  .proc2{border-top:1.5px solid var(--ink);margin-top:clamp(40px,6vh,72px)}
  .pstep{display:grid;grid-template-columns:260px 1fr;border-bottom:1.5px solid var(--ink);position:relative}
  .pstep .left{padding:clamp(28px,4vh,46px) var(--pad);border-right:1.5px solid var(--ink);display:flex;flex-direction:column;gap:12px}
  .pstep .left .num{font-family:"Space Grotesk",sans-serif;font-size:clamp(46px,6.5vw,84px);font-weight:700;line-height:.85;-webkit-text-stroke:1.6px var(--ink);color:transparent}
  .pstep .left .lbl{font-family:"IBM Plex Mono",monospace;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);font-weight:500}
  .pstep .left .dur{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--gray);border:1.5px solid var(--ink);padding:5px 10px;width:fit-content;text-transform:uppercase;letter-spacing:.06em}
  .pstep .right{padding:clamp(28px,4vh,46px) var(--pad)}
  .pstep .right h3{font-size:clamp(20px,2.7vw,32px);text-transform:uppercase;letter-spacing:-.02em}
  .pstep .right>p{color:var(--gray);font-size:16px;margin-top:14px;max-width:48em}
  .pstep .deliver{display:grid;grid-template-columns:1fr 1fr;gap:12px 26px;margin-top:24px}
  .pstep .deliver div{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;font-weight:500}
  .pstep .deliver .ar{flex:none;width:20px;height:20px;border:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;font-size:11px;font-family:"IBM Plex Mono",monospace;margin-top:1px}
  .pstep .acts{display:flex;flex-wrap:wrap;gap:7px;margin-top:24px}
  .pstep .acts i{font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--gray);border:1px solid var(--ink);padding:4px 9px}
  .pstep .bar{position:absolute;top:-1.5px;left:0;height:3px;width:0;background:var(--ink);transition:width 1s var(--ease)}
  .proc2.in .pstep .bar{width:100%}
  .pstep:nth-child(2) .bar{transition-delay:.12s}.pstep:nth-child(3) .bar{transition-delay:.24s}.pstep:nth-child(4) .bar{transition-delay:.36s}
  @media(max-width:760px){.pstep{grid-template-columns:1fr}.pstep .left{border-right:none;border-bottom:1.5px solid var(--ink);flex-direction:row;align-items:center;flex-wrap:wrap;gap:14px}.pstep .deliver{grid-template-columns:1fr}}

  .platform-wrap{margin-top:clamp(40px,6vh,72px);border-top:1.5px solid var(--ink)}
  /* REFERANSLAR — sade proje vitrini */
  .proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.3vw,32px);padding:clamp(40px,6vh,72px) var(--pad) clamp(28px,4vh,48px)}
  .proj{display:flex;flex-direction:column;border:1.5px solid var(--ink);background:var(--paper);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
  .proj:hover{transform:translate(-5px,-5px);box-shadow:9px 9px 0 var(--ink)}
  .proj-shot{display:block}
  .proj-bar{display:flex;align-items:center;gap:5px;padding:9px 13px;border-bottom:1.5px solid var(--ink);background:var(--paper)}
  .proj-bar i{width:8px;height:8px;border:1.4px solid var(--ink);border-radius:50%;display:block;flex:0 0 auto}
  .proj-bar span{margin-left:8px;font-family:"IBM Plex Mono",monospace;font-size:10px;color:var(--faint);letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .proj-img{aspect-ratio:16/10;overflow:hidden;position:relative;background:#0e0e0e;border-bottom:1.5px solid var(--ink)}
  .proj-img>img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;filter:grayscale(1) contrast(1.04);transition:filter .45s var(--ease),transform .6s var(--ease)}
  .proj:hover .proj-img>img{filter:grayscale(0);transform:scale(1.02)}
  .proj-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:24px 24px}
  .proj-ph span{font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:clamp(17px,1.8vw,23px);color:transparent;-webkit-text-stroke:1.2px #5c5c5c;text-transform:uppercase;letter-spacing:-.01em;text-align:center;padding:0 18px;transition:-webkit-text-stroke-color .3s}
  .proj:hover .proj-ph span{-webkit-text-stroke-color:#8c8c8c}
  .proj-body{padding:22px clamp(20px,2vw,28px);display:flex;flex-direction:column;flex:1}
  .proj-logo{height:clamp(30px,3vw,40px);width:auto;max-width:60%;object-fit:contain;object-position:left center;display:block;margin-bottom:16px}
  .proj-top{display:flex;justify-content:space-between;align-items:center;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--faint);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}
  .proj h3{font-size:19px;text-transform:uppercase;letter-spacing:-.01em}
  .proj-body>p{color:var(--gray);font-size:14px;margin-top:11px;line-height:1.55;flex:1}
  .proj-phone{position:absolute;right:12px;bottom:12px;width:22%;min-width:58px;background:#0c0c0c;border:1.5px solid var(--ink);border-radius:14px;padding:4px;box-shadow:0 10px 26px rgba(0,0,0,.45);z-index:2}
  .proj-phone img{width:100%;aspect-ratio:46/100;object-fit:cover;object-position:top center;display:block;border-radius:10px;filter:grayscale(1) contrast(1.04);transition:filter .45s var(--ease)}
  .proj:hover .proj-phone img{filter:grayscale(0)}
  .proj-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px}
  .proj-tags i{font-style:normal;font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--gray);border:1px solid var(--hair);padding:3px 9px;transition:border-color .15s,color .15s}
  .proj:hover .proj-tags i{border-color:var(--ink);color:var(--ink)}
  .proj-link{margin-top:20px;align-self:flex-start;font-family:"IBM Plex Mono",monospace;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink);border:1.5px solid var(--ink);padding:9px 18px;display:inline-flex;align-items:center;gap:9px;transition:background .16s,color .16s,gap .16s}
  .proj-link:hover{background:var(--ink);color:var(--paper);gap:13px}
  @media(max-width:1080px){.proj-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:640px){.proj-grid{grid-template-columns:1fr}}
  .proj-extra{display:none}
  .proj-grid.show-all .proj-extra{display:flex}
  .proj-more-wrap{display:flex;justify-content:center;padding:0 var(--pad) clamp(52px,9vh,96px)}

  /* ── Blog önizleme (ana sayfa) ── */
  .bp-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding-top:clamp(52px,8vh,96px);padding-bottom:clamp(32px,4vh,52px);border-bottom:1.5px solid var(--ink)}
  .bp-header-left{display:flex;flex-direction:column;gap:6px}
  .bp-header h2{margin:0;font-size:clamp(26px,3.2vw,46px);text-transform:uppercase;letter-spacing:-.035em}
  .bp-all-link{white-space:nowrap;flex-shrink:0}
  .bp-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;padding-top:0;padding-bottom:clamp(52px,9vh,96px)}
  .bp-feat{display:flex;flex-direction:column;border-right:1.5px solid var(--ink);text-decoration:none;color:inherit;transition:background .18s var(--ease)}
  .bp-feat:hover{background:rgba(255,255,255,.03)}
  .bp-feat-thumb{aspect-ratio:16/10;background:#0d0d0d;position:relative;overflow:hidden;border-bottom:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:32px 32px}
  .bp-feat-body{padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;flex:1}
  .bp-feat-body h3{font-size:clamp(18px,2vw,26px);text-transform:uppercase;letter-spacing:-.025em;line-height:1.12;margin:14px 0 16px}
  .bp-feat-body p{color:var(--gray);font-size:clamp(14px,1.2vw,16px);line-height:1.65;flex:1}
  .bp-read{display:inline-flex;margin-top:28px;font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.1em;text-transform:lowercase;color:var(--ink);border-bottom:1px solid transparent;transition:border-color .15s}
  .bp-feat:hover .bp-read{border-color:var(--ink)}
  .bp-side{display:flex;flex-direction:column}
  .bp-card{display:flex;flex-direction:column;flex:1;border-bottom:1.5px solid var(--ink);text-decoration:none;color:inherit;transition:background .18s var(--ease)}
  .bp-card:last-child{border-bottom:none}
  .bp-card:hover{background:rgba(255,255,255,.03)}
  .bp-card-thumb{aspect-ratio:16/7;background:#0d0d0d;overflow:hidden;border-bottom:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:24px 24px}
  .bp-card-body{padding:clamp(18px,2vw,28px);flex:1;display:flex;flex-direction:column}
  .bp-card-body h4{font-size:clamp(14px,1.4vw,18px);text-transform:uppercase;letter-spacing:-.02em;line-height:1.18;margin:10px 0 10px}
  .bp-card-body p{color:var(--gray);font-size:13px;line-height:1.58;flex:1}
  .bp-meta{display:flex;align-items:center;gap:16px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase}
  .bp-cat{color:var(--ink);border:1px solid var(--ink);padding:2px 8px}
  .bp-date{color:var(--faint)}
  .bp-label{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.22em;color:#4a4a4a;text-transform:uppercase}
  @media(max-width:860px){.bp-grid{grid-template-columns:1fr}.bp-feat{border-right:none;border-bottom:1.5px solid var(--ink)}.bp-side{flex-direction:row}.bp-card{border-bottom:none;border-right:1.5px solid var(--ink)}.bp-card:last-child{border-right:none}}
  @media(max-width:560px){.bp-side{flex-direction:column}.bp-card{border-right:none;border-bottom:1.5px solid var(--ink)}.bp-header{flex-direction:column;align-items:flex-start}}
  /* referans logo şeridi — sonsuz kayan */
  .logo-strip{border-top:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);overflow:hidden;position:relative;-webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
  .logo-track{display:inline-flex;align-items:center;white-space:nowrap;will-change:transform;animation:logomarq 32s linear infinite}
  .logo-strip:hover .logo-track{animation-play-state:paused}
  .logo-item{display:inline-flex;align-items:center;padding:24px clamp(26px,3.4vw,54px);font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:clamp(18px,2vw,28px);text-transform:uppercase;letter-spacing:-.012em;color:var(--faint);transition:color .25s var(--ease)}
  .logo-item::after{content:"";width:6px;height:6px;background:var(--hair);border-radius:50%;margin-left:clamp(26px,3.4vw,54px);flex:0 0 auto}
  .logo-item:hover{color:var(--ink)}
  .logo-item img{height:clamp(30px,3.4vw,48px);width:auto;display:block;filter:grayscale(1) contrast(1.05);opacity:.62;transition:opacity .25s var(--ease),filter .25s var(--ease)}
  .logo-item:hover img{opacity:1;filter:grayscale(0)}
  @keyframes logomarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  @media(prefers-reduced-motion:reduce){.logo-track{animation:none}}
  .tabs{display:flex;border-bottom:1.5px solid var(--ink);flex-wrap:wrap}
  .tab{font-family:"IBM Plex Mono",monospace;font-size:13px;color:var(--gray);background:var(--paper);border-right:1.5px solid var(--ink);padding:14px var(--pad);cursor:pointer;transition:.14s;flex:1;min-width:140px}
  .tab.active{color:var(--paper);background:var(--ink)}
  .tab:hover:not(.active){background:var(--mist)}
  .show{display:grid;grid-template-columns:1fr 1fr}
  .code-card{background:var(--paper);display:flex;flex-direction:column}
  .code-card:first-child{border-right:1.5px solid var(--ink)}
  .code-head{display:flex;align-items:center;gap:10px;padding:12px var(--pad);border-bottom:1.5px solid var(--ink)}
  .code-head .fn{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--ink);font-weight:500}
  .code-head .badge{margin-left:auto;font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.08em}
  pre{margin:0;padding:24px var(--pad);overflow:auto;font-family:"IBM Plex Mono",monospace;font-size:13px;line-height:1.85;flex:1}
  pre code{white-space:pre}
  .t-com{color:var(--faint);font-style:italic}.t-key{color:var(--ink);font-weight:600}
  .t-str{color:var(--gray)}.t-flag{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
  .t-num{color:var(--ink);font-weight:600}.t-pun{color:var(--faint)}

  .why{display:grid;grid-template-columns:1fr 1fr;border-top:1.5px solid var(--ink);margin-top:clamp(40px,6vh,72px)}
  .why-left{padding:clamp(40px,6vh,72px) var(--pad);border-right:1.5px solid var(--ink)}
  .why-left h2{font-size:clamp(26px,3.6vw,40px);margin-top:18px;text-transform:uppercase;letter-spacing:-.02em}
  .why-left>p{color:var(--gray);font-size:16px;margin-top:16px;max-width:36em}
  .checklist{display:flex;flex-direction:column;margin-top:28px;border-top:1px solid var(--hair)}
  .checklist li{list-style:none;display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-bottom:1px solid var(--hair);font-size:15.5px;font-weight:500}
  .checklist .ck{flex:none;width:22px;height:22px;background:var(--ink);display:flex;align-items:center;justify-content:center;margin-top:1px}
  .checklist .ck svg{width:12px;height:12px;stroke:var(--paper);fill:none;stroke-width:2.6}
  .checklist small{display:block;color:var(--gray);font-size:13.5px;font-weight:400;margin-top:3px}
  .why-right{padding:clamp(40px,6vh,72px) var(--pad);display:flex;align-items:center;background:var(--mist);background-image:linear-gradient(var(--hair) 1px,transparent 1px),linear-gradient(90deg,var(--hair) 1px,transparent 1px);background-size:32px 32px}
  .why-right .code-card{width:100%;border:1.5px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}
  .why-right pre{padding:22px}.why-right .code-head{padding:12px 18px}

  /* WORK PROCESS — sade yatay zaman çizelgesi */
  .flow{position:relative;margin-top:clamp(44px,7vh,80px);padding:0 var(--pad) clamp(60px,10vh,120px)}
  .flow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,3vw,54px)}
  .flow-step{position:relative;display:flex;flex-direction:column}
  .flow-step::before{content:"";position:absolute;top:22px;left:58px;right:calc(-1 * clamp(24px,3vw,54px));height:1.5px;background:var(--hair);z-index:0}
  .flow-step:last-child::before{display:none}
  .flow-node{width:46px;height:46px;border:1.5px solid var(--ink);background:var(--paper);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:16px;position:relative;z-index:1;transition:background .25s var(--ease),color .25s var(--ease),transform .25s var(--ease)}
  .flow-step:hover .flow-node{background:var(--ink);color:var(--paper);transform:translateY(-3px)}
  .flow-dur{margin-top:24px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
  .flow-phase{margin-top:9px;font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:clamp(17px,1.4vw,22px);letter-spacing:-.012em;text-transform:uppercase;line-height:1.12}
  .flow-step>p{margin-top:13px;color:var(--gray);font-size:14px;line-height:1.62}
  .flow-out{margin-top:20px;padding-top:18px;border-top:1px solid var(--hair);display:flex;flex-direction:column;gap:9px}
  .flow-out li{list-style:none;position:relative;padding-left:18px;font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.01em;color:var(--gray)}
  .flow-out li::before{content:"→";position:absolute;left:0;top:0;color:var(--faint)}
  .flow-foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:clamp(40px,6vh,66px);padding-top:26px;border-top:1.5px solid var(--ink);font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:var(--gray)}
  .flow-foot b{color:var(--ink);font-weight:600}
  .flow-foot .dot{width:7px;height:7px;background:var(--ink);display:inline-block;animation:pulse 1.6s steps(2) infinite}

  .uc-grid{grid-template-columns:repeat(3,1fr)}
  .uc{transition:background .15s}
  .uc:hover{background:var(--mist)}
  .uc .ic{width:46px;height:46px;border:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
  .uc .ic svg{width:22px;height:22px;stroke:var(--ink);fill:none;stroke-width:1.7}
  .uc h3{font-size:16px;text-transform:uppercase}
  .reason-grid{grid-template-columns:repeat(3,1fr)}
  .cell.reason{transition:background .15s var(--ease)}
  .cell.reason:hover{background:var(--mist)}
  .reason .rn{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--faint);letter-spacing:.12em;margin-bottom:16px;display:flex;align-items:center;gap:10px}
  .reason .rn::after{content:"";flex:1;height:1px;background:var(--hair)}
  .reason h3{font-size:17px;text-transform:uppercase;letter-spacing:-.01em}
  .reason p{color:var(--gray);font-size:14px;margin-top:10px}
  .uc p{color:var(--gray);font-size:13.5px;margin-top:8px}

  .stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1.5px solid var(--ink)}
  .stat{padding:clamp(34px,5vh,52px) var(--pad);border-right:1.5px solid var(--ink);color:var(--ink)}
  .stat:last-child{border-right:none}
  .stat .v{font-family:"Space Grotesk",sans-serif;font-size:clamp(40px,5vw,58px);font-weight:700;letter-spacing:-.04em;line-height:1}
  .stat .l{font-family:"IBM Plex Mono",monospace;color:var(--gray);font-size:12px;margin-top:12px;text-transform:uppercase;letter-spacing:.08em}

  /* FAQ — iki sütun, numaralı akordeon */
  .faq-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(28px,4.5vw,72px);padding:clamp(56px,8vh,96px) var(--pad) clamp(48px,7vh,82px)}
  .faq-aside{align-self:start;position:sticky;top:88px}
  .faq-aside h2{font-size:clamp(28px,3.4vw,44px);margin-top:16px;text-transform:uppercase;letter-spacing:-.03em}
  .faq-aside .ftxt{color:var(--gray);font-size:15.5px;margin:18px 0 26px;max-width:28em}
  .faq{border-top:1.5px solid var(--ink)}
  .faq details{border-bottom:1.5px solid var(--ink)}
  .faq summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;align-items:flex-start;gap:16px;font-family:"Space Grotesk",sans-serif;font-size:clamp(15px,1.45vw,18px);font-weight:600;color:var(--ink);letter-spacing:-.01em;transition:opacity .15s}
  .faq summary::-webkit-details-marker{display:none}
  .faq summary:hover{opacity:.6}
  .faq .qn{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--faint);font-weight:500;flex:none;width:26px;padding-top:3px}
  .faq summary .q{flex:1}
  .faq summary .plus{flex:none;width:26px;height:26px;border:1.5px solid var(--ink);position:relative;transition:.25s;margin-top:-1px}
  .faq summary .plus::before,.faq summary .plus::after{content:"";position:absolute;background:var(--ink);top:50%;left:50%;transition:.25s}
  .faq summary .plus::before{width:11px;height:1.8px;transform:translate(-50%,-50%)}
  .faq summary .plus::after{width:1.8px;height:11px;transform:translate(-50%,-50%)}
  .faq details[open] summary .plus{background:var(--ink)}
  .faq details[open] summary .plus::before{background:var(--paper)}
  .faq details[open] summary .plus::after{opacity:0}
  .faq .ans{padding:0 0 26px 42px;color:var(--gray);font-size:15px;line-height:1.66;max-width:48em}

  .cta-band{background:var(--paper);border-bottom:1.5px solid var(--ink);position:relative;overflow:hidden}
  .cta-inner{padding:clamp(64px,10vh,120px) var(--pad);text-align:center;position:relative;z-index:2}
  .cta-inner h2{font-size:clamp(32px,5.5vw,72px);margin-top:18px;text-transform:uppercase;letter-spacing:-.03em}
  .cta-inner p{color:var(--gray);font-size:17px;margin:18px auto 0;max-width:36em}
  .cta-actions{display:flex;gap:14px;justify-content:center;margin-top:36px;flex-wrap:wrap}
  .cta-grid{position:absolute;inset:0;z-index:1;opacity:.10;background-image:linear-gradient(var(--ink) 1px,transparent 1px),linear-gradient(90deg,var(--ink) 1px,transparent 1px);background-size:56px 56px}
  .cta-paw{position:absolute;bottom:0;width:clamp(112px,14vw,240px);height:auto;z-index:1;pointer-events:none;filter:drop-shadow(0 0 46px rgba(46,98,224,.42));transform:translateY(16%);opacity:.92}
  .cta-paw-r{right:clamp(6px,5vw,90px)}
  .cta-paw-l{left:clamp(6px,5vw,90px);transform:translateY(16%) scaleX(-1)}
  @media(max-width:760px){.cta-paw{width:84px;opacity:.7}}
  @media(max-width:480px){.cta-paw-l{display:none}.cta-paw-r{right:8px}}

  footer.site{padding:clamp(48px,7vh,72px) var(--pad) 38px;background:var(--paper)}
  .foot-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px}
  .foot-brand p{color:var(--gray);font-size:14px;margin-top:16px;max-width:28em}
  .foot-col h4{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-bottom:16px}
  .foot-col a{display:block;color:var(--gray);font-size:14.5px;padding:6px 0;transition:padding .15s,color .15s}
  .foot-col a:hover{color:var(--ink);padding-left:6px}
  .foot-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:52px;padding-top:26px;border-top:1.5px solid var(--ink);color:var(--faint);font-size:13px;flex-wrap:wrap;gap:14px}
  .foot-bottom .mono{font-family:"IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.08em}

  .reveal{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
  .reveal.in{opacity:1;transform:none}

  @media(max-width:1080px){.cap-grid{grid-template-columns:repeat(2,1fr)}.ref-grid{grid-template-columns:repeat(2,1fr)}.uc-grid,.reason-grid{grid-template-columns:repeat(2,1fr)}.proc-grid{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:900px){
    .hero{flex-direction:column;justify-content:space-between;gap:14px;padding:22px 0 0;min-height:calc(100vh - 92px)}
    .hero-cat-wrap{position:static;transform:none;order:2;width:100%;margin-top:auto}
    .hero-cat{width:100%;max-width:none;height:auto;display:block;margin:0 auto}
    .hero-stage{grid-template-columns:1fr;justify-items:center;gap:16px;order:1;padding-bottom:6px}
    .hero-side{align-items:center;text-align:center;max-width:34em;gap:14px}
    .hero-left,.hero-right{justify-self:center}.hero-cta{justify-content:center}
    .hero h1{font-size:clamp(25px,7vw,40px)}
    .hero-lead,.hero-meta{display:none}
    .show{grid-template-columns:1fr}.code-card:first-child{border-right:none;border-bottom:1.5px solid var(--ink)}
    .why{grid-template-columns:1fr}.why-left{border-right:none;border-bottom:1.5px solid var(--ink)}
    .flow-grid{grid-template-columns:repeat(2,1fr);gap:40px 36px}.flow-step::before{display:none}
    .faq-layout{grid-template-columns:1fr;gap:8px}.faq-aside{position:static}
    .nav-links{display:none}.menu-btn{display:inline-flex;align-items:center;justify-content:center}.nav-right .socials{display:none}.nav-right .btn-primary{display:none}
    .srow,.srow.feat,.srow.feat:nth-child(even){grid-template-columns:1fr}
    .srow.feat .body,.srow.feat:nth-child(even) .body{padding-left:var(--pad);padding-right:var(--pad)}
    .srow.feat:nth-child(even) .media{order:0}
    .srow.feat .feat-img,.srow.feat:nth-child(even) .feat-img{position:relative;top:auto;left:auto;transform:none;height:auto;width:100%;max-height:340px;order:1;border-bottom:1.5px solid var(--ink);padding:24px var(--pad)}
    .srow.feat:hover .feat-img{transform:none}
    .srow.feat .feat-ring,.srow.feat .feat-cap{display:none}
    .srow .media,.srow:nth-child(even) .media{order:0;border-right:none;border-left:none;border-bottom:1.5px solid var(--ink);min-height:300px}
    .srow .body,.srow:nth-child(even) .body{order:1}
    .foot-grid{grid-template-columns:1fr 1fr}.crosshair{display:none!important}
  }
  @media(max-width:560px){
    .cap-grid,.ref-grid,.uc-grid,.reason-grid,.proc-grid,.stats{grid-template-columns:1fr}.stat{border-right:none;border-bottom:1px solid #2c2c2c}
    .flow-grid{grid-template-columns:1fr}
    .foot-grid{grid-template-columns:1fr}.hero-meta{flex-wrap:wrap}.hero-meta div{flex:1 1 50%;border-bottom:1.5px solid var(--ink)}
    .ribbon .l span.hideS{display:none}.nav-right .lang{display:none}
  }
  @media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.proc2.in .pstep .bar{width:100%}}

  /* mobil çekmece menü — koyu tema */
  .mobile-menu{position:fixed;top:0;right:0;bottom:0;width:min(88vw,380px);display:flex;flex-direction:column;background:#0a0a0a;border-left:1.5px solid rgba(255,255,255,.1);z-index:200;transform:translateX(101%);transition:transform .44s var(--ease);overflow-y:auto;overscroll-behavior:contain;counter-reset:mmlink}
  .mobile-menu.open{transform:translateX(0);box-shadow:-20px 0 80px rgba(0,0,0,.85)}
  .mobile-menu .mm-head{position:sticky;top:0;z-index:1;padding:20px 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1.5px solid rgba(255,255,255,.07);background:#0a0a0a;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.3)}
  .mobile-menu .mm-close{width:36px;height:36px;border:1.5px solid rgba(255,255,255,.18);background:transparent;color:#fff;cursor:pointer;font-size:15px;display:flex;align-items:center;justify-content:center;transition:border-color .15s,background .15s}
  .mobile-menu .mm-close:hover{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.08)}
  .mobile-menu a:not(.btn){counter-increment:mmlink;display:flex;align-items:center;gap:16px;padding:22px 28px;color:#fff;border-bottom:1.5px solid rgba(255,255,255,.06);font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:clamp(22px,5.5vw,26px);letter-spacing:-.02em;text-transform:lowercase;transition:padding-left .2s var(--ease),background .15s}
  .mobile-menu a:not(.btn)::before{content:counter(mmlink,decimal-leading-zero);font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.1em;color:rgba(255,255,255,.22);flex-shrink:0}
  .mobile-menu a:not(.btn)::after{content:"→";margin-left:auto;font-family:"IBM Plex Mono",monospace;font-size:13px;color:rgba(255,255,255,.2);transform:translateX(-6px);transition:.2s var(--ease)}
  .mobile-menu a:not(.btn):hover{padding-left:38px;background:rgba(255,255,255,.04)}.mobile-menu a:not(.btn):hover::after{color:#fff;transform:translateX(0)}
  .mobile-menu .lang{align-self:flex-start;margin-top:auto;padding:24px 28px 0;border-top:1.5px solid rgba(255,255,255,.07);width:100%;box-sizing:border-box;border-color:rgba(255,255,255,.18)}
  .mobile-menu .lang button{color:rgba(255,255,255,.45);background:transparent;border-color:rgba(255,255,255,.18)}
  .mobile-menu .lang button.active{background:#fff;color:#000;border-color:#fff}
  .mobile-menu .btn{margin:14px 28px 32px;width:calc(100% - 56px);justify-content:center;background:#fff!important;color:#000!important;border-color:#fff!important}
  .menu-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.7);opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s;z-index:190}
  .menu-backdrop.open{opacity:1;visibility:visible}

  /* ===================== SUBPAGES ===================== */
  .page-head{position:relative;display:grid;grid-template-columns:1.06fr .94fr;border-bottom:1.5px solid var(--ink);background:var(--paper);min-height:clamp(360px,56vh,600px)}
  .ph-left{position:relative;display:flex;flex-direction:column;justify-content:center;padding:clamp(60px,10vh,118px) var(--pad);border-right:1.5px solid var(--ink);overflow:hidden;background-image:linear-gradient(var(--hair) 1px,transparent 1px),linear-gradient(90deg,var(--hair) 1px,transparent 1px);background-size:48px 48px}
  .ph-left::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--paper),transparent 60%);pointer-events:none}
  .ph-left .inner{position:relative;z-index:1;max-width:42em}
  .page-head h1{font-size:clamp(34px,5.4vw,74px);text-transform:uppercase;letter-spacing:-.035em;margin-top:18px;line-height:.96}
  .page-head .lead{color:var(--gray);font-size:clamp(16px,1.7vw,19px);margin-top:22px;max-width:40em}
  .crumb{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}
  .crumb a{color:var(--faint)}.crumb a:hover{color:var(--ink)}
  .ph-art{position:relative;overflow:hidden;background:var(--paper)}
  .ph-art .svc-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:.95}
  .ph-art .core-cap{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);border:1.5px solid var(--ink);padding:5px 12px;background:var(--paper);white-space:nowrap;z-index:2}

  .prose{max-width:46em;margin:0 auto;padding:clamp(40px,7vh,84px) var(--pad)}
  .prose>p:first-of-type{font-size:19px;color:var(--ink)}
  .prose h2{font-size:clamp(22px,3vw,30px);text-transform:uppercase;letter-spacing:-.02em;margin:40px 0 14px}
  .prose h3{font-size:18px;text-transform:uppercase;margin:30px 0 10px}
  .prose p{color:var(--gray);font-size:16px;line-height:1.74;margin:0 0 16px}
  .prose ul{margin:0 0 20px;padding:0;list-style:none}
  .prose li{position:relative;padding-left:22px;color:var(--gray);margin-bottom:10px;line-height:1.6}
  .prose li::before{content:"→";position:absolute;left:0;color:var(--faint);font-family:"IBM Plex Mono",monospace}
  .prose strong{color:var(--ink);font-weight:600}
  .prose blockquote{border-left:2.5px solid var(--ink);padding-left:22px;margin:26px 0;font-size:19px;color:var(--ink);font-style:italic}

  .form-grid{display:grid;grid-template-columns:.85fr 1.15fr;border-top:1.5px solid var(--ink)}
  .contact-aside{padding:clamp(36px,6vh,68px) var(--pad);border-right:1.5px solid var(--ink);display:flex;flex-direction:column;gap:28px}
  .cinfo .k{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
  .cinfo .v{font-size:17px;margin-top:7px;font-weight:500;display:inline-block}
  a.v:hover{text-decoration:underline}
  .form-wrap{padding:clamp(36px,6vh,68px) var(--pad)}
  .field{margin-bottom:22px}
  .field label{display:block;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gray);margin-bottom:9px}
  .field input,.field textarea,.field select{width:100%;background:var(--paper);border:1.5px solid var(--ink);padding:13px 14px;font-family:inherit;font-size:15px;color:var(--ink);border-radius:0;transition:box-shadow .15s,transform .15s}
  .field textarea{min-height:150px;resize:vertical}
  .field input:focus,.field textarea:focus,.field select:focus{outline:none;box-shadow:5px 5px 0 var(--ink)}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}

  .blog-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1.5px solid var(--ink);border-left:1.5px solid var(--ink)}
  .post{border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);display:flex;flex-direction:column;transition:background .15s var(--ease)}
  .post:hover{background:var(--mist)}
  .post .thumb{display:block;aspect-ratio:16/10;border-bottom:1.5px solid var(--ink);background:#141414;position:relative;overflow:hidden}
  .post .thumb .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.22em;color:#6f6f6f;text-transform:uppercase}
  .post:hover .thumb .ph{color:#9a9a9a}
  .post .pbody{padding:24px clamp(20px,2vw,30px);display:flex;flex-direction:column;flex:1}
  .post .pmeta{display:flex;gap:14px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint);margin-bottom:14px}
  .post h3{font-size:19px;text-transform:uppercase;letter-spacing:-.01em;line-height:1.18}
  .post p{color:var(--gray);font-size:14.5px;margin-top:12px;flex:1}
  .post .more{margin-top:18px;font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--ink);text-transform:lowercase;display:inline-flex;gap:7px}
  .post:hover .more{text-decoration:underline}

  .ab-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1.5px solid var(--ink);border-left:1.5px solid var(--ink)}
  .ab-cell{border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);padding:34px var(--pad);transition:background .15s var(--ease)}
  .ab-cell:hover{background:var(--mist)}
  .ab-cell .n{font-family:"Space Grotesk",sans-serif;font-size:30px;font-weight:700;-webkit-text-stroke:1.4px var(--ink);color:transparent;line-height:1}
  .ab-cell h3{font-size:17px;text-transform:uppercase;margin-top:16px;letter-spacing:-.01em}
  .ab-cell p{color:var(--gray);font-size:14.5px;margin-top:10px}

  @media(max-width:1080px){.blog-grid,.ab-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:900px){
    .form-grid{grid-template-columns:1fr}.contact-aside{border-right:none;border-bottom:1.5px solid var(--ink)}
    .blog-grid,.ab-grid{grid-template-columns:1fr}.field-row{grid-template-columns:1fr}
    .page-head{grid-template-columns:1fr}.ph-left{border-right:none;border-bottom:1.5px solid var(--ink)}.ph-art{min-height:300px}
  }

  /* ═══════════════════════════════════════════════════
     HAKKIMIZDA — hero split (sol metin, sağ kedi)
  ═══════════════════════════════════════════════════ */
  .ab-hero-split{position:relative;display:grid;grid-template-columns:1fr 1fr;min-height:clamp(460px,58vh,620px);background:#000;border-bottom:1.5px solid var(--ink);overflow:hidden}
  .ab-hero-split .hero-fx{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none}
  .ab-hero-left{position:relative;z-index:3;display:flex;align-items:center;padding-top:clamp(40px,7vh,80px);padding-bottom:clamp(40px,7vh,80px)}
  .ab-hero-right{position:relative;border-left:1.5px solid var(--ink);overflow:hidden;background:#000}
  .ab-cat-wrap{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;pointer-events:none;will-change:transform}
  .ab-cat{width:auto;height:auto;max-width:clamp(320px,42vw,680px);max-height:100%;display:block;filter:drop-shadow(0 0 90px rgba(46,98,224,.55))}
  .ab-hero-inner{max-width:26em;display:flex;flex-direction:column;gap:24px}
  .ab-page-tag{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}
  @media(max-width:860px){.ab-hero-split{grid-template-columns:1fr;min-height:auto}.ab-hero-right{min-height:clamp(300px,45vw,480px);border-left:none;border-top:1.5px solid var(--ink)}}
  .ab-hero-inner h1{font-size:clamp(40px,6vw,86px);text-transform:uppercase;letter-spacing:-.038em;line-height:.93;margin:0}
  .ab-hero-lead{color:var(--gray);font-size:clamp(15px,1.25vw,18px);line-height:1.65;max-width:24em}

  .ab-stats{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1.5px solid var(--ink)}
  .ab-stat{padding:clamp(28px,4vh,48px) var(--pad);border-right:1.5px solid var(--ink);display:flex;flex-direction:column}
  .ab-stat:last-child{border-right:none}
  .ab-stat .v{font-family:"Space Grotesk",sans-serif;font-size:clamp(34px,4.8vw,68px);font-weight:700;letter-spacing:-.04em;line-height:1}
  .ab-stat .l{font-family:"IBM Plex Mono",monospace;font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--faint);margin-top:10px}

  .ab-manifesto{display:grid;grid-template-columns:1fr 1fr;border-bottom:1.5px solid var(--ink)}
  .ab-manifesto-quote{padding:clamp(52px,8vh,96px) var(--pad);border-right:1.5px solid var(--ink);display:flex;flex-direction:column;gap:24px}
  .ab-manifesto-quote blockquote{font-family:"Space Grotesk",sans-serif;font-size:clamp(22px,2.8vw,38px);font-weight:700;letter-spacing:-.03em;line-height:1.14;text-transform:uppercase;margin:0}
  .ab-manifesto-quote blockquote span{color:transparent;-webkit-text-stroke:1.5px var(--ink)}
  .ab-manifesto-right{padding:clamp(52px,8vh,96px) var(--pad);display:flex;flex-direction:column;justify-content:center;gap:32px}
  .ab-manifesto-lead{color:var(--gray);font-size:clamp(15px,1.3vw,18px);line-height:1.7;margin:0}
  .ab-bullets{display:flex;flex-direction:column;gap:20px}
  .ab-bullet{display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:start}
  .ab-bullet .bn{font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--faint);letter-spacing:.1em;padding-top:3px}
  .ab-bullet p{font-size:clamp(14px,1.15vw,16px);line-height:1.65;color:var(--gray);margin:0}
  .ab-bullet p strong{color:var(--ink);font-weight:600}

  .ab-val-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1.5px solid var(--ink);border-left:1.5px solid var(--ink);margin:clamp(40px,6vh,72px) var(--pad) clamp(52px,9vh,96px)}
  .ab-val{border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);padding:clamp(28px,3.5vw,44px);display:flex;flex-direction:column;gap:12px}
  .ab-val .n{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--faint);letter-spacing:.16em}
  .ab-val h3{font-size:clamp(16px,1.6vw,21px);text-transform:uppercase;letter-spacing:-.02em;margin:0}
  .ab-val p{color:var(--gray);font-size:14px;line-height:1.65;margin:0;flex:1}
  @media(max-width:900px){.ab-manifesto{grid-template-columns:1fr}.ab-manifesto-quote{border-right:none;border-bottom:1.5px solid var(--ink)}.ab-stats{grid-template-columns:repeat(2,1fr)}.ab-stat:nth-child(2){border-right:none}.ab-stat:nth-child(3){border-top:1.5px solid var(--ink)}.ab-stat:nth-child(4){border-top:1.5px solid var(--ink)}.ab-val-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:560px){.ab-stats{grid-template-columns:1fr}.ab-stat{border-right:none;border-bottom:1.5px solid var(--ink)}.ab-val-grid{grid-template-columns:1fr}}

  /* ═══════════════════════════════════════════════════
     İLETİŞİM — split layout with cat
  ═══════════════════════════════════════════════════ */
  /* iletisim hero split */
  .ct-hero{position:relative;display:grid;grid-template-columns:1fr 1fr;min-height:clamp(520px,68vh,760px);background:#000;border-bottom:1.5px solid var(--ink);overflow:hidden}
  .ct-hero .hero-fx{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none}
  .ct-hero-left{position:relative;z-index:2;display:flex;align-items:center;padding-top:clamp(40px,7vh,80px);padding-bottom:clamp(40px,7vh,80px)}
  .ct-hero-inner{display:flex;flex-direction:column;gap:clamp(18px,2.5vh,28px)}
  .ct-hero-right{position:relative;border-left:1.5px solid rgba(255,255,255,.1);overflow:hidden;display:flex;align-items:flex-end;justify-content:center;background:#000}
  .ct-img{width:auto;height:auto;max-width:clamp(280px,43vw,640px);max-height:100%;display:block;filter:drop-shadow(0 0 70px rgba(46,98,224,.45));will-change:transform}
  .ct-tag{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.35);display:block}
  .ct-title{font-family:"Space Grotesk",sans-serif;font-size:clamp(42px,5.5vw,82px);font-weight:700;text-transform:uppercase;letter-spacing:-.038em;line-height:.93;margin:0;color:#fff}
  .ct-lead{color:rgba(255,255,255,.55);font-size:clamp(13px,1.1vw,15px);line-height:1.65;max-width:28em;margin:0}
  .ct-details{display:flex;flex-direction:column;gap:0}
  .ct-detail{display:grid;grid-template-columns:90px 1fr;gap:16px;padding:12px 0;border-top:1px solid rgba(255,255,255,.1)}
  .ct-detail:last-child{border-bottom:1px solid rgba(255,255,255,.1)}
  .ct-detail .k{font-family:"IBM Plex Mono",monospace;font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.35);padding-top:2px}
  .ct-detail .v{font-size:13.5px;color:rgba(255,255,255,.85)}
  .ct-detail a.v,.ct-social-link{color:rgba(255,255,255,.85);transition:color .15s}
  .ct-detail a.v:hover,.ct-social-link:hover{color:#fff}
  .ct-sep{color:rgba(255,255,255,.25);margin:0 6px}
  /* iletisim form section */
  .ct-form-section{background:var(--paper);border-bottom:1.5px solid var(--ink)}
  .ct-form-grid{display:grid;grid-template-columns:1.1fr .9fr}
  .ct-form-inner{padding:clamp(56px,9vh,100px) var(--pad)}
  .ct-form-head{margin-bottom:clamp(28px,4vh,44px)}
  .ct-form-head .eyebrow{display:block;margin-bottom:8px}
  .ct-form-head h2{font-size:clamp(22px,2.6vw,34px);text-transform:uppercase;letter-spacing:-.025em;margin:0 0 10px}
  .ct-form-head p{color:var(--gray);font-size:13.5px;line-height:1.6;margin:0}
  .ct-field{margin-bottom:24px}
  .ct-field label{display:block;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:10px}
  .ct-field input,.ct-field textarea,.ct-field select{width:100%;background:transparent;border:none;border-bottom:1.5px solid var(--hair);padding:10px 0;font-family:inherit;font-size:15px;color:var(--ink);transition:border-color .18s;appearance:none;-webkit-appearance:none;box-shadow:none;outline:none}
  .ct-field input::placeholder,.ct-field textarea::placeholder{color:var(--mist)}
  .ct-field input:focus,.ct-field textarea:focus,.ct-field select:focus{border-color:var(--ink)}
  .ct-field textarea{resize:vertical;min-height:130px}
  .ct-field-row{display:grid;grid-template-columns:1fr 1fr;gap:0 32px}
  .ct-form-footer{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:16px}
  .ct-disclaimer{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--faint);margin:0;line-height:1.5}

  /* CONTACT FORM ASIDE — fills the space to the right of the form */
  .ct-aside{border-left:1.5px solid var(--ink);background:var(--mist);padding:clamp(56px,9vh,100px) var(--pad);display:flex;flex-direction:column;gap:clamp(28px,4vh,40px)}
  .ct-aside-head .eyebrow{display:block;margin-bottom:12px}
  .ct-aside-head h2{font-size:clamp(20px,2.2vw,28px);text-transform:uppercase;letter-spacing:-.025em;margin:0 0 10px}
  .ct-aside-head p{color:var(--gray);font-size:13.5px;line-height:1.6;margin:0}
  .ct-steps{list-style:none;display:flex;flex-direction:column;gap:0;margin:0;padding:0}
  .ct-step{display:grid;grid-template-columns:auto 1fr;gap:18px;padding:22px 0;border-top:1.5px solid var(--hair)}
  .ct-step:last-child{border-bottom:1.5px solid var(--hair)}
  .ct-step-n{font-family:"Space Grotesk",sans-serif;font-size:26px;font-weight:700;-webkit-text-stroke:1.3px var(--ink);color:transparent;line-height:1}
  .ct-step h4{font-size:15px;text-transform:uppercase;letter-spacing:-.01em;margin:2px 0 6px}
  .ct-step p{color:var(--gray);font-size:13.5px;line-height:1.55;margin:0}
  .ct-aside-card{border:1.5px solid var(--ink);padding:22px 24px;display:flex;flex-direction:column;gap:14px;background:var(--paper)}
  .ct-aside-stat{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
  .ct-aside-stat:not(:last-child){padding-bottom:14px;border-bottom:1px solid var(--hair)}
  .ct-aside-stat .k{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
  .ct-aside-stat .v{font-family:"Space Grotesk",sans-serif;font-weight:600;font-size:15px;color:var(--ink);text-align:right}

  @media(max-width:860px){.ct-hero{grid-template-columns:1fr;min-height:auto}.ct-hero-right{min-height:clamp(280px,50vw,460px);border-left:none;border-top:1.5px solid rgba(255,255,255,.1)}.ct-img{max-width:clamp(220px,58vw,420px)}}
  @media(max-width:900px){.ct-form-grid{grid-template-columns:1fr}.ct-aside{border-left:none;border-top:1.5px solid var(--ink)}}
  @media(max-width:560px){.ct-field-row{grid-template-columns:1fr}.ct-form-footer{flex-direction:column;align-items:flex-start}.ct-aside-stat{flex-direction:column;align-items:flex-start;gap:4px}.ct-aside-stat .v{text-align:left}}