/* Ana sayfa (ADR-166) — kullanıcının tasarım görseli birebir. Açık tema (public düzen data-theme="light"). Açılış metinlerinde genişlik sınırı yok. */
:root {
  --ink: #0e2a26;
  --green: #0f6d5f; --green-d: #0b574c; --green-soft: #e6f3ef;
  --shadow-1: 0 1px 2px rgb(16 24 40 / 0.04), 0 6px 18px rgb(16 24 40 / 0.06);
  --shadow-2: 0 24px 60px rgb(16 24 40 / 0.16);
  --t-red: #fdecea; --t-red-i: #d6453d; --t-green: #e3f4e8; --t-green-i: #1f8a4c; --t-blue: #e7f0fd; --t-blue-i: #2563eb;
  --t-orange: #fdf0e3; --t-orange-i: #e07b1a; --t-teal: #e2f4f2; --t-teal-i: #0e8f84; --t-brick: #fbece6; --t-brick-i: #c2410c;
  --t-pink: #fdebf1; --t-pink-i: #db2777; --t-purple: #efe9fb; --t-purple-i: #7c3aed;
}
.icon { flex: none; }
.section { padding: 56px 0; }
.section-soft { background: var(--c-surface); }
.section h2, .sectors h2, .how h2 { font-size: 30px; letter-spacing: -0.02em; color: var(--ink); margin: 0; }
.section-lead { color: var(--c-text-muted); font-size: 18px; margin: 6px 0 28px; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.link-arrow { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 14px; color: var(--green); text-decoration: none; }
.eyebrow { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px; background: var(--green-soft); color: var(--green);
  font-size: 13px; font-weight: 600; margin: 0 0 18px; }
.btn-lg { min-height: 54px; padding: 0 28px; font-size: 16px; border-radius: 12px; gap: 10px; font-weight: 700; }
.btn-outline { background: var(--c-bg); color: var(--ink); border: 1.5px solid #c9d3d0; }
.btn-outline:hover { border-color: var(--green); color: var(--green); }

/* 1. Açılış */
.hero { position: relative; isolation: isolate; overflow: hidden; padding: 44px 0 40px; background: #f7faf9; }
.hero-photo { position: absolute; z-index: -1; top: 0; right: 0; width: 42%; height: 100%; object-fit: cover; object-position: center;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 30%); mask-image: linear-gradient(90deg, transparent 0%, #000 30%); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) 450px; gap: 24px; align-items: center; }
.hero h1 { font-size: clamp(2.2rem, 1.1rem + 3.2vw, 3.45rem); white-space: nowrap; line-height: 1.03; letter-spacing: -0.035em; color: var(--ink); margin: 0 0 18px; font-weight: 800; }
.hero .lead { font-size: clamp(1.05rem, 0.95rem + 0.45vw, 1.3rem); line-height: 1.45; color: #4a5560; margin-bottom: 26px; }
.search { display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; padding: 8px; background: #ffffff;
  border: 1px solid #e3e8e6; border-radius: 18px; box-shadow: var(--shadow-2); }
.search-field { display: grid; grid-template-columns: 30px 1fr; grid-template-rows: auto auto; column-gap: 10px; padding: 8px 18px; border-radius: 12px; }
.search-field + .search-field { border-left: 1px solid #e3e8e6; }
.search-field:focus-within { background: #f4f7f6; outline: 2px solid var(--green); outline-offset: -2px; }
.search-icon { grid-row: 1 / 3; align-self: center; color: #1c2b28; }
.search-field label { font-size: 15px; font-weight: 700; color: var(--ink); }
.search-field input { width: 100%; min-height: 24px; border: 0; padding: 0; background: transparent; color: var(--ink); font: inherit; font-size: 14px; }
.search-field input::placeholder { color: #7a858c; }
.search-field input:focus { outline: none; }
.search-btn { gap: 10px; min-height: 58px; min-width: 150px; padding: 0 28px; border-radius: 14px; font-size: 17px; font-weight: 700; }
.trust { display: flex; flex-wrap: nowrap; gap: 12px 22px; list-style: none; padding: 0; margin: 24px 0 0; color: #3d4a47; font-size: 14px; }
.trust li { white-space: nowrap; display: inline-flex; align-items: center; gap: 10px; }
.trust-icon { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 999px; background: var(--green-soft); color: var(--green); }

.hero-visual { position: relative; height: 560px; }
.phone { position: absolute; left: -10px; top: 0; width: 300px; height: 590px; padding: 9px; border-radius: 46px; background: #11161b; box-shadow: var(--shadow-2), inset 0 0 0 2px #2b3239; }
.phone-notch { position: absolute; top: 15px; left: 50%; width: 96px; height: 26px; transform: translateX(-50%); border-radius: 14px; background: #11161b; z-index: 2; }
.phone-screen { position: relative; height: 100%; border-radius: 38px; background: #ffffff; padding: 12px 16px 16px; display: flex; flex-direction: column; gap: 8px;
  overflow: hidden; color: #14211f; font-size: 11px; }
.ph-status { display: flex; justify-content: space-between; padding: 2px 8px 6px; font-size: 11px; }
.ph-status span { letter-spacing: 2px; font-size: 8px; }
.ph-top { display: flex; align-items: center; gap: 6px; font-size: 13px; }
.ph-actions { margin-left: auto; display: inline-flex; gap: 8px; color: #44524f; }
.brand-mark.sm { width: 22px; height: 22px; border-radius: 6px; }
.ph-cover { width: 100%; height: 108px; flex: none; object-fit: cover; border-radius: 12px; }
.ph-title { display: flex; justify-content: space-between; align-items: center; font-size: 15px; }
.ph-meta { display: flex; align-items: center; gap: 4px; font-size: 10px; margin-top: -4px; }
.ph-meta span, .ph-sub { color: #7a858c; }
.ph-sub { font-size: 10px; margin-top: -4px; }
.ph-meta .icon, .mock-biz i, .stars .icon { color: #f5a524; }
.ph-tabs { display: grid; grid-template-columns: repeat(4, 1fr); padding: 8px 0; border-top: 1px solid #edf0ef; border-bottom: 1px solid #edf0ef; text-align: center; font-size: 9px; color: #5b6770; }
.ph-tabs span { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.ph-service { display: flex; justify-content: space-between; align-items: flex-start; font-size: 12px; }
.ph-service span { display: flex; flex-direction: column; align-items: flex-end; }
.ph-service small { display: inline-flex; align-items: center; gap: 3px; color: #7a858c; font-size: 9px; }
.ph-days { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; text-align: center; font-size: 9px; color: #7a858c; }
.ph-days span { padding: 6px 0; border-radius: 10px; }
.ph-days b { font-size: 10px; color: #1b2a27; }
.ph-days .on { background: var(--green); color: #d7efe9; }
.ph-days .on b { color: #ffffff; }
.ph-slots, .mock-slots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.ph-slots span, .mock-slots span { padding: 8px 0; text-align: center; border-radius: 9px; background: #f2f6f5; font-weight: 600; font-size: 11px; color: #22312e; }
.ph-slots .on, .mock-slots .on { background: var(--green); color: #ffffff; }
.ph-cta { margin-top: auto; padding: 12px; border-radius: 12px; background: var(--green); color: #ffffff; text-align: center; font-weight: 700; font-size: 12px; }
.float-card { position: absolute; right: 0; top: 245px; width: 190px; display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 18px 16px;
  background: #ffffff; border-radius: 18px; box-shadow: var(--shadow-2); font-size: 12px; text-align: center; color: var(--ink); }
.float-row { display: flex; align-items: center; gap: 10px; text-align: left; color: #3d4a47; font-size: 11px; }
.float-row .icon { color: var(--green); }
.ok-dot { display: inline-grid; place-items: center; width: 36px; height: 36px; flex: none; border-radius: 999px; background: var(--green); color: #ffffff; }
.ok-dot.lg { width: 44px; height: 44px; background: #3fae6a; }

/* 2. Sektörler */
.sectors { padding: 28px 0 40px; background: #ffffff; }
.sector-grid { display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); gap: 12px; list-style: none; padding: 0; margin: 0; }
.sector-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; height: 100%; min-height: 104px; padding: 14px 6px;
  border-radius: 12px; color: #2c3a37; text-align: center; font-size: 12.5px; font-weight: 500; line-height: 1.25; text-decoration: none;
  box-shadow: var(--shadow-1); transition: transform .15s ease, box-shadow .15s ease; }
.sector-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgb(16 24 40 / 0.1); color: #2c3a37; }
.tone-red { background: var(--t-red); } .tone-red .icon, .f-icon.tone-red { color: var(--t-red-i); }
.tone-green { background: var(--t-green); } .tone-green .icon, .f-icon.tone-green { color: var(--t-green-i); }
.tone-blue { background: var(--t-blue); } .tone-blue .icon, .f-icon.tone-blue { color: var(--t-blue-i); }
.tone-orange { background: var(--t-orange); } .tone-orange .icon { color: var(--t-orange-i); }
.tone-teal { background: var(--t-teal); } .tone-teal .icon { color: var(--t-teal-i); }
.tone-brick { background: var(--t-brick); } .tone-brick .icon { color: var(--t-brick-i); }
.tone-pink { background: var(--t-pink); } .tone-pink .icon { color: var(--t-pink-i); }
.tone-purple { background: var(--t-purple); } .tone-purple .icon, .f-icon.tone-purple { color: var(--t-purple-i); }
.tone-more { background: #f3f5f5; } .tone-more .icon { color: #3d4a47; }

/* 3. Adımlar */
.how { padding: 40px 0 44px; background: #f6f8f8; }
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; list-style: none; padding: 0; margin: 0; }
.step { position: relative; display: flex; flex-direction: column; gap: 18px; padding: 22px 20px 20px; border-radius: 14px; background: #ffffff; box-shadow: var(--shadow-1); }
.step-head { display: flex; gap: 16px; }
.step-head h3 { font-size: 19px; color: var(--ink); margin: 2px 0 6px; }
.step-head p { margin: 0; font-size: 13px; color: #6b767d; }
.step-no { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 999px; background: var(--green); color: #ffffff; font-weight: 800; font-size: 18px; }
.step-arrow { position: absolute; right: -28px; top: 50%; color: #34413e; }
.mock { margin-top: auto; padding: 14px; border-radius: 12px; background: #ffffff; box-shadow: 0 2px 14px rgb(16 24 40 / 0.07); display: flex; flex-direction: column; gap: 10px; font-size: 12px; color: #1b2a27; }
.mock-search { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 9px; border: 1px solid #e6ebea; color: #2a3835; }
.mock-biz { display: flex; gap: 12px; align-items: center; }
.mock-biz img { width: 60px; height: 47px; object-fit: cover; border-radius: 6px; }
.mock-biz div { display: flex; flex-direction: column; gap: 1px; }
.mock-biz small { color: #6b767d; font-size: 10.5px; }
.mock-month { display: flex; justify-content: space-between; align-items: center; font-size: 13px; }
.mock-week { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; font-size: 10px; color: #7a858c; }
.mock-week span { display: flex; flex-direction: column; gap: 6px; }
.mock-week b { font-size: 12px; color: #26332f; font-weight: 500; }
.mock-week .on b { font-weight: 800; color: #0e1a17; }
.mock-done { align-items: center; text-align: center; }
.mock-confirm { display: flex; gap: 10px; align-items: center; text-align: left; font-size: 11px; color: #3d4a47; }
.mock-confirm img { width: 42px; height: 34px; object-fit: cover; border-radius: 5px; }
.mock-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 100%; padding: 9px; border-radius: 9px; border: 1px solid #cfd8d6; color: var(--green); font-weight: 700; }

/* 4. İşletmeler */
.business { position: relative; overflow: hidden; padding: 30px 0 0; background: linear-gradient(180deg, #e7f4f0, #eef7f4); }
.business-plant { position: absolute; right: 0; top: 0; height: 100%; width: auto; max-width: 9%; object-fit: cover; }
.business-grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 24px; align-items: end; }
.business-grid > div:first-child { padding-bottom: 40px; }
.business h2.display { font-size: clamp(1.9rem, 1.1rem + 2.2vw, 2.6rem); line-height: 1.08; letter-spacing: -0.03em; color: var(--ink); margin-bottom: 14px; }
.business .lead { font-size: 17px; line-height: 1.45; color: #4a5560; margin-bottom: 22px; }
.cta-row { display: flex; flex-wrap: wrap; gap: 14px; }
.laptop { position: relative; margin-right: 6%; }
.laptop-screen { display: grid; grid-template-columns: 112px minmax(0, 1fr) 150px; height: 300px; border: 10px solid #15191e; border-bottom: 0;
  border-radius: 14px 14px 0 0; background: #ffffff; overflow: hidden; font-size: 9px; color: #1b2a27; }
.laptop-base { height: 12px; margin: 0 -7%; border-radius: 0 0 14px 14px; background: linear-gradient(#d9dee3, #aeb5bd); }
.lp-side { display: flex; flex-direction: column; gap: 2px; padding: 10px 8px; background: #0f3d35; color: #cfe6e0; }
.lp-side span { display: flex; align-items: center; gap: 6px; padding: 5px 7px; border-radius: 6px; }
.lp-side .on { background: rgb(255 255 255 / 0.12); color: #ffffff; }
.lp-brand { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; font-weight: 700; font-size: 10px; color: #ffffff; }
.lp-main { padding: 10px 12px; border-right: 1px solid #edf0ef; }
.lp-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.lp-bar b { font-size: 12px; margin-right: auto; }
.lp-chip, .lp-select, .lp-nav { padding: 2px 6px; border: 1px solid #e3e8e6; border-radius: 5px; color: #5b6770; }
.lp-date { font-weight: 700; margin-bottom: 8px; }
.lp-cal { display: grid; grid-template-columns: 30px 1fr; gap: 8px 6px; align-items: start; }
.lp-hour { color: #8a949a; padding-top: 2px; }
.lp-ev { padding: 6px 8px; border-radius: 5px; border-left: 3px solid; display: flex; flex-direction: column; color: #43514e; }
.lp-ev b { color: #1b2a27; }
.ev-blue { background: #dfe9fb; border-color: #3b74e0; } .ev-green { background: #ddf1e4; border-color: #2f9e5f; }
.ev-pink { background: #fbe1e6; border-color: #d94f6a; } .ev-purple { background: #ebe3fb; border-color: #7f52d9; }
.lp-kpi { padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.lp-kpi-title { font-size: 11px; }
.lp-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 6px; }
.lp-kpis span { display: flex; flex-direction: column; }
.lp-kpis b { font-size: 13px; } .lp-kpis small { color: #8a949a; font-size: 7.5px; }
.lp-bars { display: flex; align-items: flex-end; gap: 6px; height: 74px; margin-top: auto; }
.lp-bars i { flex: 1; height: var(--h); border-radius: 3px 3px 0 0; background: #19a07c; }
.lp-days { display: flex; justify-content: space-between; color: #8a949a; font-size: 7px; }

/* 5. Özellikler */
.features-band { padding: 26px 0; background: #ffffff; border-bottom: 1px solid #edf0ef; }
.features { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; list-style: none; padding: 0; margin: 0; }
.features li { display: flex; gap: 12px; align-items: flex-start; }
.f-icon { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border-radius: 10px; }
.features h3 { font-size: 13.5px; margin: 0 0 3px; color: var(--ink); }
.features p { color: #6b767d; font-size: 12px; margin: 0; line-height: 1.4; }

/* 6. Yorumlar */
.reviews-band { padding: 36px 0; }
.reviews-grid { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 24px; align-items: center; }
.reviews-intro h2 { font-size: 26px; line-height: 1.15; }
.reviews { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; list-style: none; padding: 0; margin: 0; }
.review { padding: 18px; border-radius: 12px; background: #ffffff; box-shadow: var(--shadow-1); }
.review-head { display: flex; gap: 10px; align-items: center; }
.review-head div { display: flex; flex-direction: column; }
.avatar { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 999px; background: #c9a688; color: #ffffff; font-weight: 700; }
.review blockquote { margin: 10px 0 8px; font-size: 13px; color: #3d4a47; }
.stars { display: inline-flex; gap: 2px; }

/* 7. Mobil */
.app-section { padding: 0 0 4px; background: #ffffff; }
.app-band { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: 24px; overflow: hidden; height: 200px;
  padding: 22px 40px; border-radius: 22px; background: linear-gradient(120deg, #0d5a4e, #0f6d5f 55%, #0c5248); }
.app-copy { align-self: center; }
.app-band h2 { font-size: 30px; letter-spacing: -0.02em; margin: 6px 0 4px; }
.on-dark { color: #ffffff; }
.eyebrow.on-dark { background: rgb(255 255 255 / 0.16); color: #ffffff; margin: 0; font-weight: 500; }
.on-dark-muted { color: #d7ece7; font-size: 14px; margin: 0 0 10px; }
.stores { display: flex; gap: 12px; }
.store { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 9px; background: #0b0f12; color: #ffffff; border: 1px solid #3a4148;
  font-weight: 700; font-size: 14px; line-height: 1.1; }
.store small { display: block; font-size: 9px; font-weight: 400; opacity: 0.85; }
.app-phones { position: relative; }
.phone.mini { position: absolute; width: 200px; height: 330px; padding: 7px; border-radius: 32px; }
.phone.mini:first-child { left: 0; top: 18px; transform: rotate(-6deg); }
.phone.mini.dark { left: 210px; top: -6px; transform: rotate(5deg); }
.phone.mini .phone-screen { border-radius: 26px; padding: 8px 12px; gap: 7px; font-size: 9px; }
.phone.mini.dark .phone-screen { background: #0f3d35; color: #eaf6f3; }
.phone.mini .mock-search { padding: 5px 8px; font-size: 8px; color: #7a858c; }
.ph-icons { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; text-align: center; }
.ph-icons span { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 0; border-radius: 8px; }
.ph-icons small { font-size: 7px; color: #44524f; }
.ph-section { font-size: 9px; }
.ph-recs { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
.ph-recs img { width: 100%; height: 52px; object-fit: cover; border-radius: 6px; }
.ph-hello { display: grid; grid-template-columns: 1fr auto; } .ph-hello small { color: #a9d3c9; } .ph-hello b { grid-row: 2; font-size: 12px; } .ph-hello .icon { grid-row: 1 / 3; grid-column: 2; }
.ph-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ph-kpis span { display: flex; flex-direction: column; padding: 7px; border-radius: 9px; background: #ffffff; color: #14211f; }
.ph-kpis b { font-size: 14px; } .ph-kpis small { color: #6b767d; font-size: 7px; }
.ph-appt { display: flex; justify-content: space-between; padding: 6px 8px; border-radius: 8px; background: rgb(255 255 255 / 0.08); }
.ph-appt span { display: flex; flex-direction: column; } .ph-appt small { color: #a9d3c9; font-size: 7.5px; }

/* 8. Sayılar */
.stats-band { padding: 18px 0; background: #ffffff; border-bottom: 1px solid #edf0ef; }
.stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; list-style: none; padding: 0; margin: 0; }
.stats li { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: center; }
.s-icon { grid-row: 1 / 3; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 999px; background: #eef5f3; color: var(--green); }
.stats b { font-size: 22px; letter-spacing: -0.01em; line-height: 1.1; color: var(--ink); }
.stats span:not(.s-icon) { color: #6b767d; font-size: 13px; }

/* 9. Tüm sektörler */
.all-sectors { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; margin-top: 20px; }

/* Duyarlı düzen */
.br-lg { display: inline; }
@media (max-width: 1180px) {
  .hero-grid { grid-template-columns: minmax(0, 1fr) 460px; }
  .phone { left: 0; }
  .sector-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .features { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .laptop-screen { grid-template-columns: 112px minmax(0, 1fr); }
  .lp-kpi { display: none; }
}
@media (max-width: 960px) {
  .hero-grid, .business-grid, .reviews-grid { grid-template-columns: 1fr; }
  .hero-photo { width: 100%; height: 50%; top: auto; bottom: 0; -webkit-mask-image: linear-gradient(180deg, transparent, #000 40%); mask-image: linear-gradient(180deg, transparent, #000 40%); opacity: 0.55; }
  .hero-visual { height: 600px; max-width: 520px; width: 100%; margin: 0 auto; }
  .phone { left: 50%; transform: translateX(-60%); }
  .float-card { right: 0; }
  .steps, .reviews { grid-template-columns: 1fr; gap: 18px; }
  .step-arrow { display: none; }
  .stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .app-band { grid-template-columns: 1fr; height: auto; padding: 28px; }
  .app-phones { display: none; }
  .business-plant { display: none; }
  .laptop { margin: 0 4%; }
}
@media (max-width: 640px) {
  .br-lg { display: none; }
  .search { grid-template-columns: 1fr; }
  .search-field + .search-field { border-left: 0; border-top: 1px solid #e3e8e6; }
  .search-btn { margin-top: 6px; width: 100%; }
  .hero-visual { height: auto; }
  .phone { position: relative; left: auto; transform: none; margin: 0 auto; width: 270px; height: 540px; }
  .float-card { position: relative; top: auto; margin: -60px auto 0; }
  .sector-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .features { grid-template-columns: 1fr 1fr; }
  .stats { grid-template-columns: 1fr 1fr; }
  .laptop { display: none; }
  .business-grid > div:first-child { padding-bottom: 32px; }
  .section h2, .sectors h2, .how h2 { font-size: 24px; }
}
@media (prefers-reduced-motion: reduce) { .sector-card { transition: none; } .sector-card:hover { transform: none; } }

.all-sectors { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; margin-top: 20px; }
@media (max-width: 960px) { .hero h1 { white-space: normal; } .trust { flex-wrap: wrap; } .trust li { white-space: normal; } }

/* Tasarım görselleri (ADR-166) */
.hero-visual { height: auto; display: flex; justify-content: center; align-items: center; }
.hero-phone { width: 330px; height: auto; filter: drop-shadow(0 24px 40px rgb(15 40 35 / 0.18)); }
.hero-card { position: absolute; right: -40px; bottom: 60px; width: 230px; height: auto; border-radius: 22px; box-shadow: var(--shadow-2); }
.search-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 999px; background: var(--green-soft); color: var(--green); }
.search-field { grid-template-columns: 44px 1fr; column-gap: 14px; }
.sector-icon img { width: 48px; height: 48px; mix-blend-mode: multiply; }
.steps-img, .panel-img, .apps-img { display: block; width: 100%; height: auto; }
.steps-img { margin-top: 24px; border-radius: 20px; }
.panel-img { border-radius: 16px; }
.apps-img { max-width: 1100px; margin: 0 auto 28px; }
img.f-icon { width: 48px; height: 48px; border-radius: 12px; }
.app-band { height: auto; grid-template-columns: 1fr; }
@media (max-width: 960px) { .hero-card { right: 0; bottom: 20px; width: 180px; } .hero-phone { width: 280px; } }
.hero-card { right: -110px; bottom: -20px; }
@media (max-width: 1180px) { .hero-card { right: -20px; } }