/*
Theme Name: MyRepair Theme
Version:     1.0
*/

:root{
  --accent: #ff6600;
  --bg: #ffffff;
  --dark: #0f1720;
  --muted: #6b7280;
  --card-bg: #ffffff;
  --border: #e6e9ee;
  --radius: 8px;
  --transition: 250ms cubic-bezier(.2,.8,.2,1);
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  font-size: 16px;
  color-scheme: light;
}

/* Reset minimal */
*{box-sizing:border-box}
html,body{height:100%;margin:0;background:var(--bg);color:var(--dark);-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
.container{max-width:1180px;margin:0 auto;padding:28px}

/* Header */
.site-header{background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:40}
.site-header .container{display:flex;align-items:center;justify-content:space-between;padding:14px 28px}
.site-logo{display:flex;align-items:center;gap:12px}
.site-logo img{height:44px}
.primary-nav a{margin-left:20px;color:var(--muted);font-weight:600}

/* Hero */
.hero{padding:64px 0;background:linear-gradient(90deg, rgba(255,102,0,0.06), rgba(0,0,0,0));border-bottom:1px solid var(--border)}
.hero h1{font-size:32px;margin:0 0 8px}
.hero .lead{color:var(--muted);margin:0}

/* --- Platform seçim: büyük kart düzeni --- */
.platform-hero{
  min-height: calc(100vh - 100px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:40px 20px;
  background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(250,250,250,0.98));
}

.platform-grid{
  width:100%;
  max-width:1180px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:28px;
  align-items:stretch;
}

/* Büyük platform kart */
.platform-card{
  position:relative;
  overflow:hidden;
  border-radius:16px;
  min-height:420px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  color:#fff;
  cursor:pointer;
  transition:transform .6s cubic-bezier(.2,.8,.2,1), box-shadow .6s;
  box-shadow: 0 10px 30px rgba(15,17,32,0.06);
  background-size:cover;
  background-position:center center;
  isolation:isolate;
  border:1px solid rgba(0,0,0,0.04);
}

/* koyu degradé overlay */
.platform-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0.18), rgba(0,0,0,0.52));
  transition:background .4s;
  z-index:1;
}

/* içerik */
.platform-card .inner{
  position:relative;
  z-index:2;
  padding:34px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.platform-card h2{font-size:28px;margin:0 0 6px;font-weight:800;line-height:1.02}
.platform-card p{margin:0;color:rgba(255,255,255,0.92);font-size:15px;max-width:60%}
.platform-cta{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:12px;background:var(--accent);color:#fff;font-weight:800;text-decoration:none;box-shadow:0 8px 20px rgba(255,102,0,0.12);}

/* hover effect */
.platform-card:hover{
  transform:translateY(-10px) scale(1.01);
  box-shadow:0 30px 60px rgba(15,17,32,0.12);
}
.platform-card:hover::before{background:linear-gradient(180deg, rgba(0,0,0,0.08), rgba(0,0,0,0.44));}

/* subtle image scale */
.platform-card .bg-img{
  position:absolute;inset:0;z-index:0;pointer-events:none;transform:scale(1);transition:transform .9s ease,filter .6s ease;filter:brightness(0.95) saturate(1.02);
}
.platform-card:hover .bg-img{transform:scale(1.06);filter:brightness(0.98) saturate(1.05);}

/* küçük logo/ikon (opsiyonel) */
.platform-card .kicker{
  position:absolute;top:18px;left:18px;z-index:3;background:rgba(0,0,0,0.32);padding:8px 10px;border-radius:10px;font-weight:700;font-size:13px;color:#fff;
  backdrop-filter: blur(4px);
}

/* Alt kısım görsel hiyerarşisi */
.platform-card .meta-row{display:flex;align-items:center;gap:12px}

/* Responsive */
@media (max-width:980px){
  .platform-grid{grid-template-columns:1fr;gap:18px;padding:0 10px}
  .platform-card{min-height:360px;border-radius:12px}
  .platform-card p{max-width:100%}
}

/* Cards grid (eski, tema içinde korunur) */
.devices{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}
.card{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:transform var(--transition),box-shadow var(--transition)}
.card .thumb{height:160px;overflow:hidden;background:#f6f8fb}
.card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.card:hover{transform:translateY(-8px);box-shadow:0 20px 45px rgba(15,17,32,0.08)}
.card:hover .thumb img{transform:scale(1.08)}
.card .meta{padding:16px}
.card h4{margin:0 0 6px;font-size:18px}
.card .desc{color:var(--muted);font-size:14px;margin:0 0 12px}
.btn{display:inline-block;padding:10px 14px;border-radius:8px;background:var(--accent);color:#fff;font-weight:700}

/* Services grid */
.services-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.service-card{background:#fff;border:1px solid var(--border);padding:14px;border-radius:12px}
.service-card .price{font-size:18px;font-weight:800;color:var(--dark);margin-top:10px}
.warning{background:#fff5f1;color:#ff3b00;border-left:4px solid var(--accent);padding:6px 10px;display:inline-block;font-weight:700;border-radius:6px}

/* Price table */
.price-table{width:100%;border-collapse:collapse;margin-top:12px}
.price-table th, .price-table td{padding:12px 10px;border-bottom:1px solid var(--border);text-align:left}

/* Animasyon dosyası ile uyumlu sınıflar */
.fade-up{opacity:0;transform:translateY(18px);transition:all .6s cubic-bezier(.2,.8,.2,1)}
.fade-up.is-visible{opacity:1;transform:none}

/* small animated accent underline */
.animated-underline{position:relative}
.animated-underline::after{content:"";position:absolute;left:0;bottom:-6px;height:3px;width:0;background:var(--accent);transition:width .35s ease}
.animated-underline:hover::after{width:100%}