/* ============================================================
   BETA KARE — İnovatif Çözümler
   Shared stylesheet (all pages)
   ============================================================ */
:root{
  --ink:#111116;
  --ink-soft:#3c3f46;
  --gray:#6b6f78;
  --paper:#ffffff;
  --mist:#f5f6f9;
  --line:#e7e9ef;
  --cyan:#27a7df;
  --magenta:#ea0a8c;
  --green:#72bf44;
  --cyan-soft:#e6f5fc;
  --magenta-soft:#fde8f4;
  --green-soft:#eef8e7;
  --radius:20px;
  --radius-sm:12px;
  --shadow:0 10px 30px rgba(17,17,22,.07);
  --shadow-lg:0 24px 60px rgba(17,17,22,.10);
  --font-display:"Sora",sans-serif;
  --font-body:"Figtree",sans-serif;
  --maxw:1180px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
::selection{background:var(--cyan);color:#fff}

.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}

h1,h2,h3,h4{font-family:var(--font-display);line-height:1.14;letter-spacing:-.02em;font-weight:700}
.h-xl{font-size:clamp(2.5rem,5.6vw,4.25rem)}
.h-lg{font-size:clamp(2rem,4vw,3rem)}
.h-md{font-size:clamp(1.4rem,2.4vw,1.9rem)}
.lead{font-size:clamp(1.05rem,1.5vw,1.25rem);color:var(--gray);max-width:56ch}

/* dot accents used across the brand */
.dot{display:inline-block;width:.42em;height:.42em;border-radius:50%;vertical-align:baseline}
.dot--cyan{background:var(--cyan)}
.dot--magenta{background:var(--magenta)}
.dot--green{background:var(--green)}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-display);font-size:.8rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gray);
  margin-bottom:18px;
}
.eyebrow .dot{width:8px;height:8px}

/* ---------- Loader ---------- */
.loader{
  position:fixed;inset:0;z-index:200;background:var(--paper);
  display:flex;align-items:center;justify-content:center;gap:12px;
  transition:opacity .5s ease,visibility .5s ease;
}
.loader.is-done{opacity:0;visibility:hidden}
.loader span{width:14px;height:14px;border-radius:50%;animation:loaderBounce 1s infinite ease-in-out}
.loader span:nth-child(1){background:var(--cyan)}
.loader span:nth-child(2){background:var(--magenta);animation-delay:.12s}
.loader span:nth-child(3){background:var(--green);animation-delay:.24s}
@keyframes loaderBounce{0%,100%{transform:translateY(0)}40%{transform:translateY(-14px)}}

/* ---------- Nav ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  transition:background .3s ease,box-shadow .3s ease,border-color .3s ease;
  border-bottom:1px solid transparent;
}
.nav.is-scrolled{
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom-color:var(--line);
}
.nav__inner{
  max-width:var(--maxw);margin:0 auto;padding:0 24px;height:76px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.nav__brand{display:flex;align-items:center}
.nav__brand img{height:34px;width:auto;display:block}
.nav__links{display:flex;align-items:center;gap:32px;list-style:none}
.nav__links a{font-size:.95rem;font-weight:500;color:var(--ink-soft);position:relative;padding:6px 0}
.nav__links a::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:linear-gradient(90deg,var(--cyan),var(--magenta),var(--green));
  border-radius:2px;transition:width .3s ease;
}
.nav__links a:hover::after,.nav__links a.is-active::after{width:100%}
.nav__links a.is-active{color:var(--ink)}
.nav__links a.btn{padding:14px 26px;color:#fff}
.nav__links a.btn::after{display:none}
.nav__cta{margin-left:8px}
.nav__toggle{display:none;background:none;border:0;width:40px;height:40px;position:relative}
.nav__toggle span{position:absolute;left:8px;right:8px;height:2px;background:var(--ink);border-radius:2px;transition:.3s}
.nav__toggle span:nth-child(1){top:13px}
.nav__toggle span:nth-child(2){top:19px}
.nav__toggle span:nth-child(3){top:25px}
.nav__toggle.is-open span:nth-child(1){top:19px;transform:rotate(45deg)}
.nav__toggle.is-open span:nth-child(2){opacity:0}
.nav__toggle.is-open span:nth-child(3){top:19px;transform:rotate(-45deg)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--font-display);font-weight:600;font-size:.95rem;
  padding:14px 26px;border-radius:999px;border:1px solid transparent;
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease,color .25s ease;
  will-change:transform;
}
.btn svg{width:16px;height:16px;transition:transform .25s ease}
.btn:hover svg{transform:translateX(4px)}
.btn--primary{background:var(--ink);color:#fff}
.btn--primary:hover{box-shadow:0 14px 30px rgba(17,17,22,.25);transform:translateY(-2px)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--ink);transform:translateY(-2px)}
.btn--light{background:#fff;color:var(--ink)}
.btn--light:hover{box-shadow:0 14px 30px rgba(0,0,0,.2);transform:translateY(-2px)}

/* ---------- Hero ---------- */
.hero{position:relative;padding:170px 0 60px;overflow:hidden}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.hero__title{margin:0 0 22px}
.hero__title .line{display:block;overflow:hidden}
.hero__title .line>span{display:inline-block}
.hero__actions{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.hero__meta{display:flex;gap:28px;margin-top:44px;color:var(--gray);font-size:.9rem;flex-wrap:wrap}
.hero__meta strong{display:block;font-family:var(--font-display);font-size:1.35rem;color:var(--ink)}

/* the signature arc — echoes the circular arrow of the logo */
.hero__visual{position:relative;display:flex;justify-content:center}
.arc-wrap{position:relative;width:min(460px,100%)}
.arc-wrap svg{width:100%;height:auto;overflow:visible}
.arc-path{fill:none;stroke:var(--ink);stroke-width:13.5;stroke-linecap:round}
.arc-head{fill:var(--ink)}
.arc-dot{opacity:0}
.arc-b{fill:var(--ink)}

/* floating glass chips around the arc */
.chip{
  position:absolute;display:flex;align-items:center;gap:10px;
  background:rgba(255,255,255,.75);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid var(--line);border-radius:14px;padding:10px 16px;
  font-family:var(--font-display);font-size:.82rem;font-weight:600;box-shadow:var(--shadow);
  white-space:nowrap;
}
.chip .dot{width:9px;height:9px}
.chip--1{top:6%;left:-4%}
.chip--2{bottom:22%;right:-6%}
.chip--3{bottom:-2%;left:8%}

/* soft ambient blobs (kept very light) */
.blob{position:absolute;border-radius:50%;filter:blur(90px);opacity:.16;pointer-events:none}
.blob--cyan{background:var(--cyan);width:420px;height:420px;top:-120px;right:-120px}
.blob--magenta{background:var(--magenta);width:360px;height:360px;bottom:-140px;left:-140px;opacity:.10}

/* ---------- Capability strip ---------- */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;background:var(--paper)}
.strip__inner{display:flex;flex-wrap:wrap;justify-content:center;column-gap:56px;row-gap:14px}
.strip__item{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:600;color:#b6bac2;font-size:1.05rem;letter-spacing:.02em;transition:color .25s ease}
.strip__item:hover{color:var(--ink)}

/* ---------- Sections ---------- */
.section{padding:110px 0}
.section--mist{background:var(--mist)}
.section__head{max-width:720px;margin-bottom:64px}
.section__head--center{margin-left:auto;margin-right:auto;text-align:center}
.section__head--center .eyebrow{justify-content:center}
.section__head .lead{margin-top:16px}

/* ---------- Service cards ---------- */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:36px 30px;position:relative;overflow:hidden;
  transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;
}
.card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  transform:scaleX(0);transform-origin:left;transition:transform .4s ease;
}
.card--cyan::before{background:var(--cyan)}
.card--magenta::before{background:var(--magenta)}
.card--green::before{background:var(--green)}
.card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:transparent}
.card:hover::before{transform:scaleX(1)}
.card__icon{
  width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;
}
.card--cyan .card__icon{background:var(--cyan-soft);color:var(--cyan)}
.card--magenta .card__icon{background:var(--magenta-soft);color:var(--magenta)}
.card--green .card__icon{background:var(--green-soft);color:var(--green)}
.card__icon svg{width:26px;height:26px}
.card h3{font-size:1.3rem;margin-bottom:12px}
.card p{color:var(--gray);font-size:.98rem}
.card__link{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-family:var(--font-display);font-weight:600;font-size:.9rem}
.card--cyan .card__link{color:var(--cyan)}
.card--magenta .card__link{color:var(--magenta)}
.card--green .card__link{color:var(--green)}
.card__link svg{width:14px;height:14px;transition:transform .25s}
.card:hover .card__link svg{transform:translateX(4px)}

/* ---------- SaaS mockup ---------- */
.mockup{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow-lg);overflow:hidden;
}
.mockup__bar{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--line);background:#fafbfd}
.mockup__bar i{width:10px;height:10px;border-radius:50%;background:var(--line)}
.mockup__bar i:nth-child(1){background:#ffd6d6}
.mockup__bar i:nth-child(2){background:#ffe9c2}
.mockup__bar i:nth-child(3){background:#d3f2d3}
.mockup__url{margin-left:12px;flex:1;background:#fff;border:1px solid var(--line);border-radius:8px;padding:5px 12px;font-size:.75rem;color:var(--gray)}
.mockup__body{display:grid;grid-template-columns:190px 1fr;min-height:340px}
.mockup__side{border-right:1px solid var(--line);padding:20px 16px;background:#fafbfd;display:flex;flex-direction:column;gap:8px}
.mockup__side .mi{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:9px;font-size:.8rem;font-weight:600;color:var(--gray)}
.mockup__side .mi.on{background:var(--cyan-soft);color:var(--cyan)}
.mockup__side .mi i{width:8px;height:8px;border-radius:3px;background:currentColor;opacity:.7}
.mockup__main{padding:24px 26px}
.mockup__kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:22px}
.kpi{border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.kpi small{font-size:.7rem;color:var(--gray);font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.kpi strong{display:block;font-family:var(--font-display);font-size:1.3rem;margin-top:4px}
.kpi em{font-style:normal;font-size:.72rem;font-weight:700}
.kpi em.up{color:var(--green)}
.kpi em.pink{color:var(--magenta)}
.chart{display:flex;align-items:flex-end;gap:10px;height:150px;border:1px solid var(--line);border-radius:14px;padding:18px}
.chart b{flex:1;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,var(--cyan),#7fd0f0);transform-origin:bottom}
.chart b:nth-child(3n){background:linear-gradient(180deg,var(--magenta),#f37fc0)}
.chart b:nth-child(4n){background:linear-gradient(180deg,var(--green),#a9dd85)}

/* ---------- Alternating feature rows ---------- */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;padding:64px 0}
.feature+.feature{border-top:1px solid var(--line)}
.feature__visual{position:relative}
.feature--flip .feature__visual{order:2}
.feature--flip .feature__copy{order:1}
.feature h3{margin-bottom:14px}
.feature p{color:var(--gray)}
.feature ul{list-style:none;margin-top:22px;display:grid;gap:12px}
.feature li{display:flex;gap:12px;align-items:flex-start;font-size:.98rem}
.feature li svg{width:20px;height:20px;flex-shrink:0;margin-top:2px}
.tick--cyan{color:var(--cyan)}
.tick--magenta{color:var(--magenta)}
.tick--green{color:var(--green)}

/* mini visuals for feature rows */
.panel{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:26px;
}
.panel--float{position:absolute;box-shadow:var(--shadow-lg)}
.phone{
  width:210px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:32px;
  box-shadow:var(--shadow-lg);padding:14px;position:relative;z-index:1;
}
.phone__notch{width:70px;height:8px;background:var(--line);border-radius:99px;margin:2px auto 14px}
.phone__hero{height:92px;border-radius:18px;background:linear-gradient(135deg,var(--cyan),#7fd0f0);margin-bottom:12px}
.phone__row{height:12px;border-radius:6px;background:var(--mist);margin-bottom:8px}
.phone__row--w60{width:60%}
.phone__grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.phone__grid i{height:56px;border-radius:12px;background:var(--mist);display:block}
.phone__grid i:nth-child(1){background:var(--magenta-soft)}
.phone__grid i:nth-child(4){background:var(--green-soft)}

.chatui{display:grid;gap:12px}
.bubble{max-width:82%;padding:12px 16px;border-radius:16px;font-size:.88rem;line-height:1.5}
.bubble--user{background:var(--ink);color:#fff;justify-self:end;border-bottom-right-radius:4px}
.bubble--ai{background:var(--mist);border-bottom-left-radius:4px}
.bubble--ai b{color:var(--green)}
.typing{display:inline-flex;gap:5px;padding:12px 16px;background:var(--mist);border-radius:16px;border-bottom-left-radius:4px;width:max-content}
.typing i{width:7px;height:7px;border-radius:50%;background:#b8bcc4;animation:loaderBounce 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}
.typing i:nth-child(3){animation-delay:.3s}

/* consultancy visual: stacked step cards */
.steps-visual{display:grid;gap:14px}
.step-card{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 20px;box-shadow:var(--shadow)}
.step-card i{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:.85rem;flex-shrink:0}
.step-card:nth-child(1) i{background:var(--cyan-soft);color:var(--cyan)}
.step-card:nth-child(2) i{background:var(--magenta-soft);color:var(--magenta)}
.step-card:nth-child(3) i{background:var(--green-soft);color:var(--green)}
.step-card b{font-family:var(--font-display);font-size:.95rem}
.step-card small{color:var(--gray);display:block;font-size:.8rem}

/* ---------- Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stat{padding:34px 16px;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
.stat strong{font-family:var(--font-display);font-size:clamp(2.2rem,4vw,3rem);letter-spacing:-.03em;display:block}
.stat span{color:var(--gray);font-size:.92rem}
.stat u{text-decoration:none}
.stat:nth-child(1) u{color:var(--cyan)}
.stat:nth-child(2) u{color:var(--magenta)}
.stat:nth-child(3) u{color:var(--green)}
.stat:nth-child(4) u{color:var(--cyan)}

/* ---------- Testimonial ---------- */
.quote{max-width:820px;margin:0 auto;text-align:center}
.quote blockquote{font-family:var(--font-display);font-size:clamp(1.3rem,2.6vw,1.9rem);font-weight:600;line-height:1.45;letter-spacing:-.01em}
.quote figcaption{margin-top:26px;color:var(--gray);font-size:.95rem}
.quote figcaption b{color:var(--ink)}
.quote .qmarks{display:flex;justify-content:center;gap:8px;margin-bottom:26px}
.quote .qmarks i{width:10px;height:10px;border-radius:50%}
.quote .qmarks i:nth-child(1){background:var(--cyan)}
.quote .qmarks i:nth-child(2){background:var(--magenta)}
.quote .qmarks i:nth-child(3){background:var(--green)}

/* testimonial slider */
.quotes{overflow:hidden;padding-bottom:4px}
.quotes__track{display:flex;align-items:flex-start;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.quotes .quote{flex:0 0 100%;max-width:100%;padding:0 12px;box-sizing:border-box}
.quotes .quote blockquote{max-width:820px;margin:0 auto}
.quotes__nav{display:flex;justify-content:center;gap:10px;margin-top:40px}
.quotes__nav button{width:10px;height:10px;border-radius:50%;border:0;padding:0;background:var(--line);transition:background .25s ease,transform .25s ease}
.quotes__nav button:hover{background:var(--gray)}
.quotes__nav button.is-active{background:var(--ink);transform:scale(1.25)}

/* ---------- CTA band ---------- */
.cta{
  position:relative;overflow:hidden;border-radius:28px;
  background:var(--ink);color:#fff;text-align:center;
  padding:clamp(60px,8vw,96px) 24px;
}
.cta h2{margin-bottom:14px}
.cta p{color:#b9bcc6;max-width:52ch;margin:0 auto 34px}
.cta .cta__dots{position:absolute;inset:0;pointer-events:none}
.cta .cta__dots i{position:absolute;border-radius:50%;opacity:.9}
.cta .cta__dots i:nth-child(1){width:12px;height:12px;background:var(--cyan);top:22%;left:12%}
.cta .cta__dots i:nth-child(2){width:9px;height:9px;background:var(--magenta);top:64%;left:20%}
.cta .cta__dots i:nth-child(3){width:11px;height:11px;background:var(--green);top:30%;right:14%}
.cta .cta__dots i:nth-child(4){width:7px;height:7px;background:var(--cyan);bottom:20%;right:24%}

/* ---------- Footer ---------- */
.footer{border-top:1px solid var(--line);padding:72px 0 36px;background:var(--paper)}
.footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:56px}
.footer__logo{width:150px;height:auto;margin-bottom:18px}
.footer p{color:var(--gray);font-size:.92rem;max-width:34ch}
.footer h4{font-size:.85rem;text-transform:uppercase;letter-spacing:.12em;margin-bottom:18px;color:var(--ink)}
.footer ul{list-style:none;display:grid;gap:10px}
.footer ul a{color:var(--gray);font-size:.94rem;transition:color .2s}
.footer ul a:hover{color:var(--ink)}
.footer__bottom{border-top:1px solid var(--line);padding-top:28px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--gray);font-size:.85rem}
.footer__bottom .brand-dots{display:inline-flex;gap:5px;margin-left:6px;vertical-align:middle}
.footer__bottom .brand-dots i{width:7px;height:7px;border-radius:50%}
.footer__bottom .brand-dots i:nth-child(1){background:var(--cyan)}
.footer__bottom .brand-dots i:nth-child(2){background:var(--magenta)}
.footer__bottom .brand-dots i:nth-child(3){background:var(--green)}

/* ---------- Page hero (inner pages) ---------- */
.page-hero{padding:170px 0 70px}
.page-hero .lead{margin-top:18px}

/* ---------- Services page ---------- */
.service-block{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;padding:80px 0;align-items:start}
.service-block+.service-block{border-top:1px solid var(--line)}
.service-block__badge{
  width:64px;height:64px;border-radius:18px;display:flex;align-items:center;justify-content:center;margin-bottom:24px;
}
.service-block__badge svg{width:30px;height:30px}
.sb--cyan .service-block__badge{background:var(--cyan-soft);color:var(--cyan)}
.sb--magenta .service-block__badge{background:var(--magenta-soft);color:var(--magenta)}
.sb--green .service-block__badge{background:var(--green-soft);color:var(--green)}
.service-block h2{margin-bottom:14px}
.service-block>.service-block__copy p{color:var(--gray)}
.service-list{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.service-item{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;transition:transform .3s,box-shadow .3s}
.service-item:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.service-item b{font-family:var(--font-display);font-size:1rem;display:block;margin-bottom:6px}
.service-item span{color:var(--gray);font-size:.88rem;line-height:1.5;display:block}
.sb--cyan .service-item:hover{border-color:var(--cyan)}
.sb--magenta .service-item:hover{border-color:var(--magenta)}
.sb--green .service-item:hover{border-color:var(--green)}

/* process timeline */
.process{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;counter-reset:step}
.process__item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px 22px;position:relative}
.process__item i{
  display:flex;width:40px;height:40px;border-radius:50%;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:700;font-size:.9rem;color:#fff;background:var(--ink);margin-bottom:18px;
}
.process__item:nth-child(1) i{background:var(--cyan)}
.process__item:nth-child(2) i{background:var(--magenta)}
.process__item:nth-child(3) i{background:var(--green)}
.process__item:nth-child(4) i{background:var(--cyan)}
.process__item:nth-child(5) i{background:var(--magenta)}
.process__item b{font-family:var(--font-display);display:block;margin-bottom:8px}
.process__item span{color:var(--gray);font-size:.85rem;line-height:1.5}

/* ---------- Projects ---------- */
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:44px}
.filters button{
  border:1px solid var(--line);background:#fff;border-radius:999px;padding:10px 22px;
  font-family:var(--font-display);font-weight:600;font-size:.88rem;color:var(--gray);
  transition:all .25s;
}
.filters button:hover{border-color:var(--ink);color:var(--ink)}
.filters button.is-active{background:var(--ink);border-color:var(--ink);color:#fff}
.projects{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.project{
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;
  transition:transform .35s,box-shadow .35s;
}
.project:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}
.project__cover{height:280px;position:relative;overflow:hidden;background:#fff;border-bottom:1px solid var(--line)}
.project__cover img{width:100%;height:100%;object-fit:contain;padding:14px;box-sizing:border-box;display:block;transition:transform .5s ease}
.project:hover .project__cover img{transform:scale(1.04)}
.project__body{padding:26px 28px}
.project__tags{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.project__tags span{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 12px;border-radius:99px}
.tag--web{background:var(--cyan-soft);color:var(--cyan)}
.tag--mobil{background:#eef0f4;color:var(--ink-soft)}
.tag--ai{background:var(--green-soft);color:var(--green)}
.tag--danismanlik{background:var(--magenta-soft);color:var(--magenta)}
.project h3{font-size:1.25rem;margin-bottom:8px}
.project p{color:var(--gray);font-size:.94rem}
.project.is-hidden{display:none}

/* ---------- About ---------- */
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:center}
.about-visual{position:relative;display:flex;justify-content:center}
.about-visual .arc-wrap{width:min(380px,100%)}
.values{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.timeline{position:relative;max-width:760px;margin:0 auto;display:grid;gap:0}
.timeline::before{content:"";position:absolute;left:19px;top:8px;bottom:8px;width:2px;background:var(--line)}
.timeline__item{position:relative;padding:0 0 44px 64px}
.timeline__item:last-child{padding-bottom:0}
.timeline__item i{
  position:absolute;left:8px;top:4px;width:24px;height:24px;border-radius:50%;
  border:5px solid #fff;box-shadow:0 0 0 1px var(--line);
}
.timeline__item:nth-child(3n+1) i{background:var(--cyan)}
.timeline__item:nth-child(3n+2) i{background:var(--magenta)}
.timeline__item:nth-child(3n) i{background:var(--green)}
.timeline__item b{font-family:var(--font-display);font-size:1.1rem;display:block;margin-bottom:6px}
.timeline__item b small{color:var(--gray);font-weight:600;font-size:.8rem;margin-left:10px;letter-spacing:.08em}
.timeline__item p{color:var(--gray);font-size:.95rem}
.team{display:flex;flex-wrap:wrap;justify-content:center;gap:24px}
.member{width:calc(20% - 19.2px)}
.member{text-align:center}
.member:nth-child(even){margin-top:28px}
.member__photo{aspect-ratio:1;border-radius:var(--radius);margin-bottom:16px;overflow:hidden;background:var(--mist);transition:transform .35s ease,box-shadow .35s ease}
.member:hover .member__photo{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.member__photo img{width:100%;height:100%;object-fit:cover;display:block}
.member__role{display:inline-flex;align-items:center;gap:7px}
.member__role .dot{width:7px;height:7px}

/* team extras: freelancer pool + join */
.team-extra{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:56px}
.pool-card{position:relative;background:var(--ink);color:#fff;border-radius:var(--radius);padding:40px 36px;overflow:hidden}
.pool-card h3{font-size:1.4rem;margin-bottom:12px;padding-right:110px}
.pool-card>p{color:#b9bcc6;font-size:.95rem;max-width:46ch}
.pool-card ul{list-style:none;margin-top:22px;display:grid;gap:12px}
.pool-card li{display:flex;align-items:center;gap:12px;font-size:.95rem;font-weight:500}
.pool-card li .dot{width:8px;height:8px;flex-shrink:0}
.pool-card__badge{position:absolute;top:32px;right:32px;font-family:var(--font-display);font-weight:700;font-size:.85rem;background:rgba(255,255,255,.14);border-radius:999px;padding:8px 16px}
.pool-card__dots{position:absolute;right:30px;bottom:26px;display:flex;gap:8px}
.pool-card__dots i{width:9px;height:9px;border-radius:50%}
.pool-card__dots i:nth-child(1){background:var(--cyan)}
.pool-card__dots i:nth-child(2){background:var(--magenta)}
.pool-card__dots i:nth-child(3){background:var(--green)}
.join-card{border:2px dashed #cfd4de;border-radius:var(--radius);padding:40px 36px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px}
.join-card h3{font-size:1.4rem}
.join-card p{color:var(--gray);font-size:.95rem;margin-bottom:14px}
.member b{font-family:var(--font-display);display:block}
.member span{color:var(--gray);font-size:.88rem}

/* ---------- Contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.form{display:grid;gap:18px}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form label{display:grid;gap:8px;font-family:var(--font-display);font-weight:600;font-size:.85rem}
.form input,.form select,.form textarea{
  font-family:var(--font-body);font-size:.95rem;color:var(--ink);
  border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:#fff;
  transition:border-color .2s,box-shadow .2s;width:100%;
}
.form input:focus,.form select:focus,.form textarea:focus{
  outline:none;border-color:var(--cyan);box-shadow:0 0 0 4px var(--cyan-soft);
}
.form textarea{resize:vertical;min-height:140px}
.form__success{
  display:none;background:var(--green-soft);border:1px solid var(--green);color:#2f6414;
  border-radius:12px;padding:16px 18px;font-size:.95rem;
}
.form__success.is-visible{display:block}
.form__error{display:none;background:#fdecec;border:1px solid #e05252;color:#8f1d1d;border-radius:12px;padding:16px 18px;font-size:.95rem}
.form__error.is-visible{display:block}
.info-cards{display:grid;gap:18px;margin-bottom:28px}
.info-card{display:flex;gap:18px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px}
.info-card i{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.info-card:nth-child(1) i{background:var(--cyan-soft);color:var(--cyan)}
.info-card:nth-child(2) i{background:var(--magenta-soft);color:var(--magenta)}
.info-card:nth-child(3) i{background:var(--green-soft);color:var(--green)}
.info-card i svg{width:20px;height:20px}
.info-card b{font-family:var(--font-display);display:block;margin-bottom:4px}
.info-card span,.info-card a{color:var(--gray);font-size:.92rem}
.info-card a:hover{color:var(--ink)}
.map{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
.map iframe{display:block;width:100%;height:300px;border:0;filter:grayscale(.5)}

/* ---------- Reveal helpers ---------- */
.reveal{opacity:0;transform:translateY(36px)}
html.no-js .reveal,html.reduced .reveal{opacity:1;transform:none}

/* ---------- Responsive ---------- */
@media(max-width:1020px){
  .hero__grid{grid-template-columns:1fr;gap:64px}
  .hero{padding-top:150px}
  .cards{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:1fr 1fr}
  .process{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns:1fr 1fr}
  .feature{grid-template-columns:1fr;gap:44px}
  .feature--flip .feature__visual{order:0}
  .service-block{grid-template-columns:1fr;gap:36px}
  .about-grid,.contact-grid{grid-template-columns:1fr}
  .member{width:calc(33.333% - 16px)}
  .member:nth-child(even){margin-top:0}
  .team-extra{grid-template-columns:1fr}
}
@media(max-width:720px){
  .nav__links{
    position:fixed;top:76px;left:0;right:0;bottom:0;background:#fff;
    flex-direction:column;align-items:flex-start;gap:8px;padding:24px;
    transform:translateX(100%);transition:transform .35s ease;
  }
  .nav__links.is-open{transform:translateX(0)}
  .nav__links a{font-size:1.3rem;font-family:var(--font-display);padding:12px 0}
  .nav__cta{margin:16px 0 0}
  .nav__toggle{display:block}
  .nav__links a.btn{font-size:1rem;padding:14px 26px}
  .cards{grid-template-columns:1fr}
  .section{padding:80px 0}
  .projects{grid-template-columns:1fr}
  .service-list{grid-template-columns:1fr}
  .form__row{grid-template-columns:1fr}
  .member{width:calc(50% - 12px)}
  .mockup__body{grid-template-columns:1fr}
  .mockup__side{display:none}
  .chip--1{left:0}
  .chip--2{right:0}
  .strip__inner{column-gap:28px;row-gap:10px}
  .strip__item{font-size:.95rem}
  .nav__brand img{height:28px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
}
