/* self-hosted fonts (Carlito + Questrial, latin & latin-ext incl. Turkish ı ş ğ) */
@font-face{font-family:'Carlito';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/carlito-latin-400.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Carlito';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/carlito-latin-ext-400.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Carlito';font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/carlito-latin-700.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Carlito';font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/carlito-latin-ext-700.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Carlito';font-style:italic;font-weight:400;font-display:swap;src:url('assets/fonts/carlito-latin-400italic.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Carlito';font-style:italic;font-weight:400;font-display:swap;src:url('assets/fonts/carlito-latin-ext-400italic.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Questrial';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/questrial-latin-400.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Questrial';font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/questrial-latin-ext-400.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}

:root{
  --bg:#efeee9;
  --ink:#2b2b2e;
  --body:rgba(58,58,62,0.88);
  --muted:rgba(58,58,62,0.75);
  --soft:rgba(58,58,62,0.80);
  --rule:rgba(58,58,62,0.18);
  --rule-lt:rgba(58,58,62,0.12);
  --box:rgba(58,58,62,0.16);
  --acc:rgb(194,65,12);
  --acc-deep:rgb(154,52,10);
  --acc-05:rgba(194,65,12,0.05);
  --acc-06:rgba(194,65,12,0.06);
  --acc-14:rgba(194,65,12,0.14);
  /* design canvas: 1440x940, 76px side padding. The page is laid out at design
     pixels and uniformly contain-fit-scaled to the viewport by site.js (like the
     design tool). Viewports wider than the scaled canvas hand their leftover
     width (--extra) 20% to each side margin; the rest widens the open middle. */
  --pad-x:calc(76px + var(--extra) * 0.2);
  --fit:1;
  --extra:0px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:hidden}
body{background:var(--bg);color:var(--ink);font-family:'Carlito',Calibri,sans-serif;-webkit-font-smoothing:antialiased}

button{font-family:inherit;background:none;border:none;padding:0;color:inherit;cursor:pointer}
button:focus-visible,a:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

.shell{position:relative;display:flex;flex-direction:column;min-height:calc(100vh / var(--fit))}
.shell>*{position:relative;z-index:1}

.moon-bg{position:absolute;z-index:0;right:-128px;top:44%;transform:translateY(-50%);width:544px;height:544px;opacity:0.13;pointer-events:none}

/* ---------- header ---------- */
.site-header{display:flex;align-items:center;justify-content:space-between;padding:40px var(--pad-x)}
.mark{display:flex;align-items:baseline;gap:9px}
.mark-name{font-family:'Questrial','Carlito',sans-serif;font-size:27px;color:var(--ink);letter-spacing:0.4px}
.mark-moon{width:17px;height:17px;align-self:center;transform:translateY(-6px)}
.mark-suffix{font-size:10px;letter-spacing:3.2px;color:var(--muted)}

.lang-toggle{display:flex;border:1px solid var(--box)}
.lang-toggle a{display:inline-block;font-size:12px;letter-spacing:1px;padding:6px 14px;color:var(--soft);text-decoration:none;transition:background .18s ease,color .18s ease}
.lang-toggle a:hover{background:var(--acc-14)}
.lang-toggle a.active{color:var(--acc-deep)}

/* ---------- main ---------- */
/* right pane is 560px at the 1440 design size; on wider screens it absorbs 48%
   of the leftover width (divider moves left, KAPSAM/detail gets room) */
.main-grid{flex:1;display:grid;grid-template-columns:1fr calc(560px + var(--extra) * 0.48);padding:0 var(--pad-x);align-items:center;gap:72px}
.col-left{display:flex;flex-direction:column}
h1{margin:0;font-weight:400;font-size:38px;line-height:1.25;color:var(--ink);letter-spacing:-0.3px;text-wrap:pretty}
.hero-sub{margin:22px 0 0;font-size:15px;line-height:1.75;color:var(--body);max-width:430px}

.acc-nav{margin-top:30px;max-width:430px}
.acc-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:13px 10px 13px 8px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);border-left:2px solid transparent;transition:background .18s ease,border-color .18s ease,padding-left .18s ease;background:transparent}
.acc-row.gap{margin-top:12px}
.acc-row:hover{background:var(--acc-06);padding-left:14px}
.acc-row.open{border-left-color:rgba(194,65,12,0.85);background:var(--acc-05)}
.acc-lab{font-size:9.5px;letter-spacing:2.8px;color:var(--muted)}
.acc-row.open .acc-lab{font-weight:700;color:var(--acc-deep)}

.chev{margin-left:auto;font-size:17px;font-weight:700;line-height:1;color:var(--acc-deep);transform:rotate(0deg);transition:transform .2s ease;animation:nudge 3.4s ease-in-out infinite}
.acc-row.open .chev,.prc-row.open .prc-chev{transform:rotate(90deg);animation:none}

@keyframes nudge{0%,88%,100%{transform:translateX(0);opacity:.6}94%{transform:translateX(4px);opacity:1}}

/* labels — h2 elements styled identically to the former spans */
.k{margin:0;font-size:9.5px;font-weight:400;letter-spacing:2.8px;color:var(--muted)}

/* ---------- desktop detail pane ---------- */
.detail-pane{min-height:330px;padding-left:28px;border-left:1px solid var(--rule)}
.pane-block{display:none;flex-direction:column;gap:12px}
.pane-block.is-open{display:flex}
.pane-block p{margin:0;font-size:13.5px;line-height:1.75;color:var(--body);max-width:460px}

.svc-grid{display:grid;grid-template-columns:252px 1fr;gap:10px;align-items:start}
.svc-picker{display:flex;flex-direction:column;gap:11px}
.prc-list{display:flex;flex-direction:column}
.prc-row{display:flex;align-items:baseline;gap:10px;width:100%;text-align:left;padding:8px 26px 8px 8px;position:relative;border-bottom:1px solid var(--rule-lt);border-left:2px solid transparent;transition:background .18s ease,border-color .18s ease,padding-left .18s ease;background:transparent}
.prc-row:hover{background:var(--acc-06);border-left-color:rgba(194,65,12,0.5);padding-left:14px}
.prc-row.open{border-left-color:rgba(194,65,12,0.85);background:var(--acc-05)}
.prc-num{font-size:9.5px;width:16px;flex:none;color:var(--muted)}
.prc-row.open .prc-num{color:var(--acc-deep)}
.prc-lab{font-size:13.5px;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis;color:var(--body)}
.prc-row.open .prc-lab{color:var(--acc-deep)}
.prc-chev{position:absolute;right:8px;top:50%;margin-top:-9px;margin-left:0}

.svc-detail{border-left:1px solid var(--rule);padding-left:26px;min-height:250px}
.svc-detail-block{display:none;flex-direction:column;gap:11px}
.svc-detail-block.is-open{display:flex}
.svc-title{margin:0;font-size:13px;font-weight:400;letter-spacing:1.6px;color:var(--acc-deep);line-height:1.4}
.svc-items{display:flex;flex-direction:column;gap:11px;margin-top:4px}
.svc-item{display:flex;gap:11px}
.svc-item .dot{color:var(--muted);font-size:13.5px;line-height:1.6;width:5px;flex:none}
.svc-item span:last-child{font-size:13.5px;line-height:1.6;color:var(--body)}

/* ---------- contact ---------- */
.contact-stack{display:flex;flex-direction:column;gap:11px}
.contact-line{font-size:13.5px;line-height:1.65;color:var(--body)}
.contact-tel{font-size:13.5px;color:var(--body);text-decoration:none;font-variant-numeric:tabular-nums;width:fit-content}
.contact-tel:hover{color:var(--acc-deep)}
.contact-mail{font-size:13.5px;color:var(--ink);text-decoration:none;border-bottom:1px solid rgba(58,58,62,0.28);padding-bottom:2px;width:fit-content}
.contact-mail:hover{color:var(--acc-deep);border-bottom-color:rgba(194,65,12,0.55)}

/* ---------- inline (mobile) panels ---------- */
.panel-inline{display:none}
.inline-about p{margin:16px 2px 0;font-size:13.1px;line-height:1.75;color:var(--body)}
.inline-about p+p{margin:12px 2px 6px}
.prc-list-m{display:flex;flex-direction:column;margin:12px 0 6px}
.prc-m .prc-items{display:none;flex-direction:column;gap:10px;padding:14px 2px 14px 22px}
.prc-m.open .prc-items{display:flex}
.prc-m .prc-row{padding:10px 8px}
.prc-m .prc-chev{position:static;margin-top:0;margin-left:auto}
.prc-m .svc-item .dot{font-size:13.1px}
.prc-m .svc-item span:last-child{font-size:13.1px}
.inline-contact .contact-stack{padding:16px 2px 6px;gap:10px}
.inline-contact .contact-line{font-size:13.1px}
.inline-contact .contact-tel,.inline-contact .contact-mail{display:flex;align-items:center;min-height:44px;font-size:14px;border-bottom:none}

/* ---------- clients strip ---------- */
.clients{margin:0 var(--pad-x);padding:20px 0 22px;display:flex;flex-direction:column;gap:14px}
.refs-mask{min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.refs-track{display:flex;gap:14px;width:max-content;animation:refsDrift 80s linear infinite}
.refs-track:hover{animation-play-state:paused}
@keyframes refsDrift{to{transform:translateX(calc(-50% - 7px))}}
.ref-tile{flex:none;width:132px;height:132px;display:flex;align-items:center;justify-content:center;padding:10px}
.ref-tile img{max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(1);transition:filter .25s ease}
.ref-tile img:hover{filter:grayscale(0)}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--rule);margin:0;padding:0 var(--pad-x);height:52px;display:flex;align-items:center}
.foot-row{display:flex;align-items:center;gap:26px;width:100%;font-size:11.5px;color:var(--muted)}
.foot-row .sep{font-size:19px;line-height:0}
.foot-row .num,.foot-details .num{font-variant-numeric:tabular-nums}
.foot-right{margin-left:auto}
.foot-toggle{display:none}
.foot-details{display:none}

/* ---------- mobile ---------- */
@media (min-width:900px){
  .panel-inline{display:none !important}
}

@media (max-width:899px){
  .moon-bg{right:-102px;top:150px;transform:none;width:281px;height:281px}

  .site-header{padding:22px 22px 16px}
  .mark-name{font-size:24px}
  .mark-moon{width:15px;height:15px;transform:translateY(-5px)}
  .mark-suffix{font-size:9px;letter-spacing:2.8px}
  .lang-toggle a{padding:10px 16px;font-size:13px}
  .lang-toggle a.active{background:var(--acc-14)}

  .main-grid{display:block;padding:0 22px}
  h1{font-size:29px;line-height:1.24;padding-top:12px}
  .hero-sub{margin-top:16px;font-size:14px;line-height:1.7;max-width:none}
  .acc-nav{margin-top:26px;max-width:none}
  .acc-row:hover{padding-left:8px}

  .detail-pane{display:none !important}
  .panel-inline.is-open{display:block}

  .clients{margin:0;padding:40px 0 16px;gap:12px}
  .clients-label{padding:0 22px;font-size:9px;letter-spacing:2.6px}
  .refs-mask{-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
  .ref-tile{width:88px;height:88px;padding:8px}

  .site-footer{flex-direction:column;align-items:stretch;height:auto;padding:0 22px 30px}
  .foot-row{display:none}
  .foot-toggle{display:flex;align-items:center;justify-content:center;padding:12px 2px 10px}
  .foot-chev{margin-left:0;animation:none;transform:rotate(-90deg)}
  .foot-toggle.open .foot-chev{transform:rotate(90deg)}
  .foot-details.is-open{display:flex;flex-direction:column;gap:7px;padding:0 2px 8px;font-size:11.5px;color:var(--muted)}
}

@media (prefers-reduced-motion:reduce){
  .refs-track{animation:none}
  .chev{animation:none}
}