/* ===========================================================
   GURIZON · CRM & DASHBOARD — page-specific
   index1-mix.css ve logo-tasarimi.css'in üzerine yüklenir.
   =========================================================== */

/* Hero */
.cr-hero{padding:140px 0 60px;position:relative;overflow:hidden}
.cr-hero-grid{display:grid;gap:60px;grid-template-columns:1fr;align-items:center;position:relative;z-index:2}
@media(min-width:1024px){.cr-hero-grid{grid-template-columns:1fr 1.05fr;gap:70px}}
.cr-hero h1{
  font-size:clamp(40px,6.4vw,80px);font-weight:900;line-height:1;letter-spacing:-.03em;
  color:#0a0a0a !important;margin:0 0 24px;
}
.cr-hero h1 .strike{
  text-decoration:line-through;text-decoration-thickness:5px;
  text-decoration-color:#dc2626;color:#a8a08c;font-weight:800;
}

/* ===== Dashboard Mockup ===== */
.dm-stage{
  position:relative;display:flex;align-items:center;justify-content:center;
  min-height:560px;perspective:1500px;
}
.dash-mockup{
  width:100%;max-width:600px;
  background:#ffffff;border:1px solid #ecdfd9;border-radius:18px;
  overflow:hidden;
  box-shadow:
    0 30px 80px -20px rgba(127,20,20,.30),
    0 16px 40px -16px rgba(127,20,20,.18),
    0 1px 0 rgba(255,255,255,.7) inset;
  transform:rotateY(-4deg) rotateX(2deg);transform-origin:center;
  transition:transform .5s ease;
}
.dash-mockup:hover{transform:rotateY(0deg) rotateX(0deg)}
@media(max-width:1023px){.dash-mockup{transform:none}}

.dm-bar{
  display:flex;align-items:center;justify-content:space-between;
  padding:13px 16px;
  background:linear-gradient(180deg,#fbf6ed,#f5efe3);
  border-bottom:1px solid #ecdfd9;
}
.dm-title{
  display:flex;align-items:center;gap:10px;
  font:800 12.5px/1 'Manrope';color:#0a0a0a;letter-spacing:-.005em;
}
.dm-title::before{
  content:"";width:18px;height:18px;border-radius:5px;
  background:linear-gradient(120deg,#dc2626,#7f1d1d);
}
.dm-title small{
  display:block;font:600 10px/1 'JetBrains Mono', monospace;
  color:#71717a;letter-spacing:.5px;margin-top:3px;
}
.dm-bar-r{display:flex;align-items:center;gap:8px}
.dm-bell{
  width:26px;height:26px;border-radius:7px;
  background:#fff;border:1px solid #ecdfd9;
  display:grid;place-items:center;color:#525252;font-size:11px;
  position:relative;
}
.dm-bell::after{
  content:"";position:absolute;top:4px;right:4px;
  width:6px;height:6px;border-radius:50%;background:#dc2626;
  box-shadow:0 0 0 2px #fff;
}
.dm-user{
  width:30px;height:30px;border-radius:50%;
  background:linear-gradient(120deg,#dc2626,#7f1d1d);color:#fff;
  display:grid;place-items:center;font:800 11px/1 'JetBrains Mono', monospace;
}

.dm-body{padding:18px;display:flex;flex-direction:column;gap:16px}

/* Stats row */
.dm-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.dm-stat{
  background:#fbf6ed;border:1px solid #ecdfd9;border-radius:12px;
  padding:13px 14px;display:flex;flex-direction:column;gap:4px;position:relative;
}
.dm-stat strong{
  font:900 22px/1 'Manrope';color:#0a0a0a;letter-spacing:-.02em;
  display:flex;align-items:baseline;gap:5px;
}
.dm-stat strong em{font:800 12px/1 'JetBrains Mono', monospace;font-style:normal;color:#7f1d1d}
.dm-stat span{font:600 10.5px/1.2 'Manrope';color:#71717a;letter-spacing:.2px}
.dm-stat .delta{
  position:absolute;top:13px;right:13px;
  font:800 10px/1 'JetBrains Mono', monospace;color:#16a34a;
  padding:3px 7px;background:rgba(22,163,74,.10);border:1px solid rgba(22,163,74,.25);
  border-radius:999px;
}

/* Chart card */
.dm-chart{
  background:#ffffff;border:1px solid #ecdfd9;border-radius:12px;
  padding:14px;
}
.dm-chart-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.dm-chart-h strong{font:800 12px/1 'JetBrains Mono', monospace;color:#0a0a0a;letter-spacing:1px;text-transform:uppercase}
.dm-chart-h span{font:600 10px/1 'JetBrains Mono', monospace;color:#71717a;letter-spacing:.5px}
.dm-bars{display:flex;align-items:flex-end;gap:7px;height:90px}
.dm-bar{
  flex:1;border-radius:5px 5px 0 0;
  background:linear-gradient(180deg,#dc2626,#7f1d1d);
  position:relative;
}
.dm-bar.alt{background:linear-gradient(180deg,#f97316,#9a3412)}
.dm-bar.dim{background:#e8dfd0}

/* Pipeline */
.dm-pipe{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pipe-col{
  background:#fbf6ed;border:1px solid #ecdfd9;border-radius:10px;
  padding:10px;display:flex;flex-direction:column;gap:7px;
}
.pipe-col-h{
  display:flex;align-items:center;justify-content:space-between;
  font:800 10px/1 'JetBrains Mono', monospace;color:#0a0a0a;letter-spacing:.6px;text-transform:uppercase;
  margin-bottom:2px;
}
.pipe-col-h .ct{
  font:800 9.5px/1 'JetBrains Mono', monospace;
  color:#7f1d1d;padding:3px 7px;
  background:rgba(220,38,38,.10);border:1px solid rgba(220,38,38,.20);border-radius:999px;
}
.pipe-card{
  background:#ffffff;border:1px solid #e8dfd0;border-radius:7px;
  padding:8px 9px;display:flex;flex-direction:column;gap:4px;
  border-left:3px solid #dc2626;
}
.pipe-card.alt{border-left-color:#f97316}
.pipe-card.warm{border-left-color:#facc15}
.pipe-card .pcl{height:5px;border-radius:3px;background:#0a0a0a;width:80%}
.pipe-card .pcl.s{height:4px;background:#d4cdba;width:60%}

/* Floating badges */
.dm-badge{
  position:absolute;
  padding:11px 16px;border-radius:999px;
  background:#ffffff;border:1.5px solid #7f1d1d;
  box-shadow:5px 5px 0 #7f1d1d;
  font:800 12px/1 'Manrope';color:#0a0a0a;
  display:inline-flex;align-items:center;gap:8px;z-index:5;
}
.dm-badge .pi{
  width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;color:#fff;
}
.dm-badge.b1{top:-12px;left:-22px}
.dm-badge.b1 .pi{background:#dc2626}
.dm-badge.b2{bottom:24px;right:-30px}
.dm-badge.b2 .pi{background:#16a34a}
@media(max-width:760px){.dm-badge{display:none}}

/* ===== Modül grid ===== */
.mod-grid{
  display:grid;grid-template-columns:1fr;gap:18px;
  max-width:1240px;margin:0 auto;
}
@media(min-width:640px){.mod-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.mod-grid{grid-template-columns:repeat(4,1fr)}}
.mod{
  background:#ffffff;border:1px solid #ecdfd9;border-radius:18px;
  padding:24px 22px;
  box-shadow:0 6px 24px -10px rgba(127,20,20,.10),0 1px 0 rgba(255,255,255,.7) inset;
  transition:transform .25s,border-color .25s,box-shadow .3s;
  display:flex;flex-direction:column;gap:8px;position:relative;overflow:hidden;
}
.mod::before{
  content:"";position:absolute;top:-30%;right:-30%;
  width:140px;height:140px;
  background:radial-gradient(circle,rgba(220,38,38,.10),transparent 70%);
  opacity:0;transition:opacity .3s;
}
.mod:hover{
  transform:translateY(-4px);border-color:rgba(220,38,38,.40);
  box-shadow:0 24px 50px -20px rgba(220,38,38,.30);
}
.mod:hover::before{opacity:1}
.mod-ic{
  width:46px;height:46px;border-radius:12px;
  background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.18);
  color:#dc2626;display:grid;place-items:center;font-size:18px;
  margin-bottom:6px;position:relative;z-index:1;
}
.mod h3{font-size:16px;font-weight:900;color:#0a0a0a;margin:0;letter-spacing:-.005em;line-height:1.2;position:relative;z-index:1}
.mod p{font-size:13px;color:#525252;line-height:1.5;margin:0;font-weight:500;position:relative;z-index:1}
.mod-tag{
  position:absolute;top:18px;right:18px;
  font:800 9.5px/1 'JetBrains Mono', monospace;
  letter-spacing:.6px;color:#16a34a;
  padding:4px 8px;background:rgba(22,163,74,.10);border:1px solid rgba(22,163,74,.25);
  border-radius:999px;text-transform:uppercase;
}

/* ===== Integration logo strip ===== */
.int-wrap{padding:80px 0;position:relative;overflow:hidden}
.int-marquee{
  position:relative;overflow:hidden;
  -webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.int-track{
  display:flex;gap:18px;width:max-content;
  animation:intScroll 40s linear infinite;
}
@keyframes intScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.int{
  display:flex;align-items:center;gap:11px;
  padding:14px 22px;
  background:#ffffff;border:1px solid #ecdfd9;border-radius:14px;
  white-space:nowrap;
  box-shadow:0 4px 12px -6px rgba(127,20,20,.10);
}
.int i{
  width:32px;height:32px;border-radius:8px;
  background:#fbf6ed;border:1px solid #ecdfd9;
  display:grid;place-items:center;
  color:#0a0a0a;font-size:15px;
}
.int strong{font:800 13px/1 'Manrope';color:#0a0a0a;letter-spacing:-.005em}
.int span{font:600 10.5px/1 'JetBrains Mono', monospace;color:#71717a;letter-spacing:.2px}
.int-info{display:flex;flex-direction:column;gap:3px}

/* ===== VS comparison block (SaaS CRM vs Custom) ===== */
.cmp-grid{
  display:grid;gap:24px;grid-template-columns:1fr;
  max-width:1180px;margin:0 auto;
}
@media(min-width:768px){.cmp-grid{grid-template-columns:1fr 1fr}}
.cmp-col{
  background:#ffffff;border:1px solid #ecdfd9;border-radius:22px;
  padding:32px 30px;position:relative;overflow:hidden;
  box-shadow:0 8px 28px -10px rgba(127,20,20,.10);
}
.cmp-col.win{
  background:linear-gradient(160deg,#fff5f3 0%,#ffffff 60%);
  border-color:rgba(220,38,38,.40);
  box-shadow:0 24px 60px -25px rgba(220,38,38,.40);
}
.cmp-tag{
  display:inline-block;padding:5px 12px;border-radius:999px;
  font:800 10.5px/1 'JetBrains Mono', monospace;letter-spacing:1.2px;text-transform:uppercase;
  margin-bottom:14px;
  background:rgba(0,0,0,.05);color:#525252;border:1px solid rgba(0,0,0,.08);
}
.cmp-col.win .cmp-tag{background:rgba(220,38,38,.10);color:#7f1d1d;border-color:rgba(220,38,38,.30)}
.cmp-col h3{font-size:24px;font-weight:900;color:#0a0a0a;margin:0 0 8px;letter-spacing:-.01em;line-height:1.15}
.cmp-col.win h3{
  background:linear-gradient(120deg,#dc2626,#7f1d1d);
  -webkit-background-clip:text !important;background-clip:text !important;-webkit-text-fill-color:transparent !important;
}
.cmp-col .price{font:600 13.5px/1.4 'Manrope';color:#b91c1c;margin-bottom:18px;display:flex;align-items:center;gap:8px}
.cmp-col.win .price{color:#16a34a}
.cmp-list2{list-style:none;padding:0;margin:0}
.cmp-list2 li{
  display:flex;align-items:flex-start;gap:10px;padding:10px 0;
  font-size:13.5px;color:#262626;line-height:1.5;font-weight:500;
  border-bottom:1px solid #f1e6dc;
}
.cmp-list2 li:last-child{border-bottom:0}
.cmp-list2 li i{flex-shrink:0;margin-top:3px;width:18px;text-align:center;font-size:11px}
.cmp-col:not(.win) .cmp-list2 li i{color:#b91c1c}
.cmp-col.win .cmp-list2 li i{color:#16a34a}
.cmp-list2 li strong{color:#0a0a0a;font-weight:700}
