/* ══════════════════════════════════════════════════════════════
   RoomRecipe — rr-home-v5.css (sadece index-v5.html)
   v3 yapısı + v4 görselleri/etkileşimleri. rr-core.css ve rr-revision.css'ten
   SONRA yüklenir; v3'ün rr-home.css'i yüklenmez (kullanılan kuralları aşağıda).
   Yalnızca v3 değişkenleri kullanılır
   (--navy, --teal, --teal-dark, --light-teal, --cream, --paper, --line,
   --muted, --radius); v3 kırılımları: 1150 / 900 / 700 / 370px.
   ══════════════════════════════════════════════════════════════ */

/* ══════════════ v3 temel kuralları (rr-home.css'ten taşındı) ══════════════
   v5 artık rr-home.css yüklemiyor. Buradakiler yalnızca v5 DOM'unda eşleşen v3
   kurallarıdır (hero, adım kartı, ürün paneli/fotoğrafı, odanda gör metni, uygulama
   rozetleri, fiyat şeridi, bölüm başlıkları); sıra ve medya sorguları korunmuştur.
   rr-home.css (canlı v3) değiştirilmedi. */
.hero{display: grid; grid-template-columns: minmax(320px, 0.75fr) 1.25fr; max-width: 1600px; margin: auto; min-height: 590px; overflow: hidden;}
.hero-copy{padding: 104px 40px 70px max(44px, calc((100vw - 1240px) / 2)); align-self: center;}
.hero h1{font-size: clamp(36px, 3.35vw, 51px); font-weight: 800; letter-spacing: -1.9px; line-height: 1.13; margin: 17px 0px 22px; white-space: nowrap;}
.hero-description{max-width: 315px; color: rgb(83, 97, 109); font-size: 15px; line-height: 1.75;}
.hero-visual{position: relative; min-width: 0px; min-height: 590px; overflow: hidden;}
.hero-image{width: 100%; height: 100%; position: absolute; object-fit: cover; object-position: 52% center;}
.photo-pin:hover .pin-dot{transform: scale(1.22); box-shadow: rgba(41, 179, 185, 0.17) 0px 0px 0px 8px;}
.steps-section{padding-top: 63px; padding-bottom: 63px;}
.steps-section h2{font-size: 32px;}
.step-card{background: rgb(255, 255, 255); border: 1px solid rgb(237, 232, 224); border-radius: 9px; padding: 22px 18px 17px; position: relative; box-shadow: var(--shadow); min-width: 0px;}
.shop-section{background: rgb(255, 255, 255);}
.shop-layout{display: grid; grid-template-columns: 1.65fr 1fr; gap: 25px; align-items: stretch;}
.shop-photo{position: relative; border-radius: var(--radius); min-height: 425px; overflow: hidden;}
.photo-pin{position: absolute; display: flex; align-items: center; flex-direction: column-reverse; gap: 8px; padding: 5px; background: transparent;}
.pin-label{background: rgba(255, 255, 255, 0.933); box-shadow: rgba(0, 0, 0, 0.067) 0px 2px 8px; border-radius: 4px; padding: 5px 9px; font-size: 9px; font-weight: 650; white-space: nowrap; transition: background 0.2s, color 0.2s;}
.photo-pin.is-selected .pin-label{background: var(--navy); color: rgb(255, 255, 255);}
.photo-pin .pin-dot{width: 14px; height: 14px;}
.photo-hint{position: absolute; bottom: 17px; left: 18px; display: flex; align-items: center; gap: 6px; background: var(--navy); color: rgb(255, 255, 255); padding: 7px 11px; border-radius: 20px; font-size: 9px; pointer-events: none;}
.photo-hint .icon{width: 13px; height: 13px;}
.example-note{font-size: 10px; color: rgb(123, 133, 139); margin-top: 13px;}
.preview-section{background: rgb(255, 255, 255); padding-top: 85px; padding-bottom: 95px;}
.preview-layout{display: grid; grid-template-columns: 1.35fr 1fr; gap: 68px; align-items: center;}
.preview-media{position: relative; padding-bottom: 32px; min-width: 0px;}
.preview-copy h2{font-size: 33px; letter-spacing: -1.1px; margin-bottom: 17px; line-height: 1.2;}
.preview-copy > p:not(.eyebrow){font-size: 13px; color: var(--muted); max-width: 340px; line-height: 1.75;}
.preview-copy .button{width: 100%; max-width: 340px;}
.app-section{background: rgb(255, 255, 255); padding: 68px 0px 48px;}
.app-section h2{font-size: 32px;}
@media (min-width: 1601px){
  .hero-copy{padding-left: 150px;}
  .hero h1{font-size: 51px;}
  .hero-visual{min-height: 630px;}
}
@media (max-width: 1150px){
  .hero-copy{padding-left: 44px; padding-right: 25px;}
  .hero h1{font-size: 40px; letter-spacing: -1.5px;}
  .hero{grid-template-columns: 0.85fr 1.15fr; min-height: 540px;}
  .hero-visual{min-height: 540px;}
  .step-card{padding: 18px 14px 14px;}
  .shop-photo{min-height: 400px;}
  .preview-layout{gap: 43px; grid-template-columns: 1.2fr 1fr;}
  .preview-copy h2{font-size: 28px;}
}
@media (max-width: 900px){
  .hero{grid-template-columns: 0.9fr 1.1fr;}
  .hero h1{font-size: 33px; letter-spacing: -1.2px;}
  .hero-copy{padding-left: 35px; padding-right: 15px;}
  .hero-description{font-size: 13px;}
  .steps-section h2{font-size: 28px;}
  .shop-layout{grid-template-columns: 1.25fr 1fr; gap: 16px;}
  .shop-photo{min-height: 388px;}
  .preview-layout{gap: 30px; grid-template-columns: 1.1fr 1fr;}
  .preview-copy h2{font-size: 26px;}
  .preview-copy > p:not(.eyebrow){font-size: 12px;}
  .app-section h2{font-size: 27px;}
}
@media (max-width: 700px){
  .hero{display: flex; flex-direction: column; min-height: 0px;}
  .hero-copy{padding: 52px 24px 38px; align-self: auto; text-align: center;}
  .hero-copy .eyebrow{font-size: 9px; letter-spacing: 2px;}
  .hero h1{font-size: clamp(34px, 7.5vw, 47px); white-space: normal; line-height: 1.15; letter-spacing: -1.6px; margin: 14px 0px 18px;}
  .hero-description{font-size: 13px; line-height: 1.8; margin: auto; max-width: 320px;}
  .hero-visual{min-height: 0px; height: 380px; flex-shrink: 0;}
  .hero-image{object-position: 50% center;}
  .step-card{padding: 21px 19px 18px; border-radius: 10px;}
  .shop-layout{display: flex; flex-direction: column; gap: 16px;}
  .shop-photo{min-height: 0px; height: 350px; border-radius: 11px;}
  .photo-pin .pin-dot{width: 13px; height: 13px;}
  .pin-label{font-size: 8px;}
  .photo-hint{font-size: 8px; padding: 6px 8px; bottom: 12px; left: 12px;}
  .example-note{font-size: 9px; margin-top: 12px;}
  .preview-layout{display: flex; flex-direction: column; gap: 31px;}
  .preview-media{width: 100%; padding-bottom: 25px;}
  .preview-copy{width: 100%; padding: 0px 4px;}
  .preview-copy h2{font-size: 29px;}
  .preview-copy > p:not(.eyebrow){font-size: 13px; max-width: 100%;}
  .preview-copy .button{max-width: none;}
}
@media (max-width: 370px){
  .hero h1{font-size: 32px;}
  .hero-visual{height: 335px;}
  .shop-photo{height: 300px;}
  .preview-copy h2{font-size: 26px;}
}
.step-card{border-radius: 12px; padding: 22px 18px 18px;}
.shop-layout{grid-template-columns: 1.5fr 1fr; gap: 24px;}
.shop-photo{min-height: 560px;}
.pin-label{font-size: 11px;}
.photo-pin{min-width: 44px; min-height: 44px;}
.photo-pin .pin-dot{background: rgb(255, 255, 255); border-color: var(--teal-dark);}
.photo-pin.is-selected .pin-dot{background: var(--teal-dark); border-color: rgb(255, 255, 255);}
.photo-hint{font-size: 11px;}
.example-note{font-size: 11px; color: var(--muted);}
@media (max-width: 1150px){
  .shop-layout{grid-template-columns: 1.25fr 1fr; gap: 18px;}
}
@media (min-width: 701px) and (max-width: 900px){
  .step-card{padding: 22px;}
  .shop-layout{grid-template-columns: 1fr;}
  .shop-photo{min-height: 0px; height: 430px;}
}
@media (max-width: 700px){
  .hero-copy{padding-top: 45px; padding-bottom: 32px;}
  .hero-description{font-size: 14px;}
  .shop-photo{min-height: 0px; height: 350px;}
  .pin-label{font-size: 10px;}
  .photo-hint{font-size: 10px;}
  .example-note{font-size: 11px;}
}
@media (max-width: 370px){
  .shop-photo{height: 300px;}
}
.app-badges{display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 22px;}
.app-badges .store-badges{justify-content: center; gap: 12px;}
@media (max-width: 700px){
  .app-badges .store-badges{gap: 8px;}
}
.pricing-section{padding: 56px 0px 0px; background: var(--cream);}
.pricing-strip{display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 22px 40px; padding: 30px 36px; border-radius: var(--radius); background: var(--light-teal);}
.pricing-copy h2{font-size: 26px; letter-spacing: -0.8px; margin-bottom: 8px;}
.pricing-copy p{font-size: 14px; line-height: 1.7; color: var(--muted); max-width: 540px;}
.pricing-actions{display: flex; align-items: center; flex-wrap: wrap; gap: 14px 24px;}
.pricing-actions .text-link{margin-top: 0px; font-size: 13px;}
@media (max-width: 700px){
  .pricing-section{padding-top: 40px;}
  .pricing-strip{flex-direction: column; align-items: stretch; padding: 26px 22px;}
  .pricing-copy h2{font-size: 23px;}
  .pricing-actions{flex-direction: column; align-items: stretch;}
  .pricing-actions .button{width: 100%;}
  .pricing-actions .text-link{justify-content: center; min-height: 44px;}
}
@media (max-width: 900px){
  .steps-section,.preview-section,.app-section{padding: 56px 0px;}
}
@media (max-width: 700px){
  .steps-section,.preview-section,.app-section{padding: 48px 0px;}
}
@media (max-width: 700px){
  .section-heading h2{font-size: 27px; line-height: 1.25; letter-spacing: -0.9px; margin-bottom: 12px;}
}
@media (max-width: 370px){
  .section-heading h2{font-size: 24px;}
}

/* Karşılaştırma kaydırıcısının konumu animasyonlu geçebilsin diye kayıtlı özellik */
@property --pos {
  syntax: '<percentage>';
  inherits: true;
  initial-value: 50%;
}

.rr-page--home-v5 { --ease-out: cubic-bezier(.22, .61, .36, 1); }

/* ── Sahne: görseli "cover" gibi yerleştirir, işaretler görselin kendi
   koordinatlarına yapışık kalır. Kapsayıcı container-type: size olmalı. ── */
.v5-stage {
  --ar: 1;
  --stage-w: max(100cqw, 100cqh * var(--ar));
  --stage-h: max(100cqh, 100cqw / var(--ar));
  position: absolute;
  width: var(--stage-w);
  height: var(--stage-h);
  left: calc((100cqw - var(--stage-w)) * var(--fx, .5));
  top: calc((100cqh - var(--stage-h)) * var(--fy, .5));
}
.v5-stage__img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; }
.v5-stage--square { --ar: 1; }
.v5-stage--space { --ar: .9932; --fy: .55; }
/* Mağaza fotoğrafı görselin ortasına değil işaretlerin aralığına göre ortalanır
   (yatay %14.9–74.4 → merkez %44.65; dikey %17.9–87.0 → merkez %52.45):
   kadraj nasıl kırpılırsa kırpılsın beş işaret de görünür kalır */
.v5-stage--shop {
  --ar: 1.5;
  left: clamp(100cqw - var(--stage-w), 50cqw - var(--stage-w) * .4465, 0px);
  top: clamp(100cqh - var(--stage-h), 50cqh - var(--stage-h) * .5245, 0px);
}

/* ══════════════ 2: Hero — değer önerisi + durum çipi ══════════════ */
/* TR metni daha uzun: dengeli satırlar, ≥1151px'te en fazla 3 satır (52px üst sınırla).
   Daha dar ekranlarda revizyonun boyutları geçerli. */
.rr-page--home-v5 .hero h1 { white-space: normal; text-wrap: balance; }
@media (min-width: 1151px) {
  .rr-page--home-v5 .hero h1 { font-size: clamp(40px, 3.9vw, 52px); }
}
/* EN'deki satır kırılımı TR'de ve dar sütunda her yarıyı ikiye bölüp 4 satır yapıyordu */
html:lang(tr) .rr-page--home-v5 .hero h1 br { display: none; }
.v5-hero-chip {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 13px 7px 8px;
  border-radius: 20px;
  background: #fffffff2;
  color: var(--navy);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.3;
  box-shadow: 0 4px 14px #10253b1f;
  pointer-events: none;
}
.v5-hero-chip .icon {
  flex: none;
  width: 20px;
  height: 20px;
  padding: 3px;
  border-radius: 50%;
  background: var(--light-teal);
  color: var(--teal-dark);
}
/* Görsel yüklenince belirir (JS .is-in ekler); JS yoksa hep görünür */
.rr-js .v5-hero-chip:not(.is-in) { opacity: 0; }
.rr-js .v5-hero-chip.is-in { animation: v5-chip-pop .5s var(--ease-out) .15s backwards; }
@keyframes v5-chip-pop {
  from { opacity: 0; translate: 0 6px; scale: .92; }
  to   { opacity: 1; translate: 0 0; scale: 1; }
}

/* Hero görselindeki etiketler tıklanabilir: etiket bir düğme, açılınca altında
   "Find this piece →" bağlantısı belirir; aynı anda tek etiket açık.
   rr-revision.css etiket katmanına pointer-events:none veriyor — etiketlerde açılır. */
.rr-page--home-v5 .hero-match { pointer-events: auto; cursor: pointer; }
.rr-page--home-v5 .hero-match.is-open { z-index: 2; }
.rr-page--home-v5 .hero-match-label { transition: border-color .2s, box-shadow .25s var(--ease-out); }
.v5-hero-tag__toggle {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: pointer;
}
/* Fiyat satırı artık düğmenin içinde: revizyondaki .hero-match-label>span biçimi */
.v5-hero-tag__toggle > span { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.v5-hero-tag__toggle:focus-visible { outline: 2px solid var(--teal-dark); outline-offset: 4px; border-radius: 4px; }
.rr-page--home-v5 .hero-match.is-open .hero-match-label { border-color: var(--teal-dark); box-shadow: 0 0 0 1px var(--teal-dark), 0 8px 22px #10253b24; }
.rr-page--home-v5 .hero-match.is-open .pin-dot { background: var(--teal-dark); }
.v5-hero-tag__cta:not([hidden]) {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
  color: var(--teal-dark);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.v5-hero-tag__cta .icon { width: 14px; height: 14px; }
.v5-hero-tag__cta:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .rr-page--home-v5 .hero-match:hover .hero-match-label { border-color: var(--teal); box-shadow: 0 8px 18px rgba(16, 37, 59, .16); }
  .rr-page--home-v5 .hero-match.is-open:hover .hero-match-label { border-color: var(--teal-dark); }
}
@media (max-width: 900px) {
  .v5-hero-tag__toggle > span { margin-top: 0; font-size: 10px; }
  .v5-hero-tag__cta:not([hidden]) { margin-top: 6px; padding-top: 6px; font-size: 11px; }
  .v5-hero-tag__cta .icon { width: 12px; height: 12px; }
}

/* ══════════════ 3: #how-it-works — v4 kart düzeni ══════════════ */
.v5-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.rr-page--home-v5 .v5-step {
  padding: 12px 12px 24px;
  border-color: var(--line);
  background: var(--paper);
  transition: transform .35s var(--ease-out), box-shadow .35s var(--ease-out);
}
.v5-step__media {
  position: relative;
  aspect-ratio: 358 / 428;
  overflow: hidden;
  border-radius: 10px;
  background: var(--cream);
}
.v5-step__media > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease-out);
}
.v5-step--products .v5-step__media > img { object-position: 50% 46%; }
.v5-step--inspiration .v5-step__media > img { object-position: 50% 30%; transform: scale(1.1); transform-origin: 50% 30%; }
.v5-step__title {
  display: flex;
  gap: 8px;
  margin-top: 20px;
  padding-inline: 4px;
  font-size: 20px;
  line-height: 1.3;
}
.v5-step__num { color: var(--teal-dark); font-variant-numeric: tabular-nums; }

/* Kart 01: iki giriş yolu — A "Fotoğraf yükle" / B "Yapay zekâ ile oluştur".
   Çipler görselin içinde, küçük (11–12px); görselin ~%30'undan fazlasını kaplamaz. */
.v5-start { position: absolute; inset: 0; pointer-events: none; }
.v5-start__switch { pointer-events: auto; }
.v5-start__chip,
.v5-start__ai,
.v5-start__status,
.v5-scan { transition: opacity .35s var(--ease-out), translate .35s var(--ease-out); }
/* Tarama köşeleri (v3 scan-corner üslubu) — yalnız "yükle" durumunda */
.v5-scan { position: absolute; inset: 20% 16% 34%; }
.v5-scan__c { position: absolute; width: 18px; height: 18px; border: 0 solid #fff; filter: drop-shadow(0 1px 2px #10253b40); }
.v5-scan__c--tl { top: 0; left: 0; border-width: 2px 0 0 2px; border-top-left-radius: 4px; }
.v5-scan__c--tr { top: 0; right: 0; border-width: 2px 2px 0 0; border-top-right-radius: 4px; }
.v5-scan__c--bl { bottom: 0; left: 0; border-width: 0 0 2px 2px; border-bottom-left-radius: 4px; }
.v5-scan__c--br { bottom: 0; right: 0; border-width: 0 2px 2px 0; border-bottom-right-radius: 4px; }
.v5-start__chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 6px 10px 6px 8px;
  border-radius: 16px;
  background: #fffffff0;
  color: var(--navy);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.3;
  box-shadow: 0 3px 10px #10253b1f;
}
.v5-start__chip .icon { flex: none; width: 14px; height: 14px; color: var(--teal-dark); }
.v5-start__chip--file { position: absolute; top: 12px; left: 12px; }
.v5-start__ai {
  position: absolute;
  top: 12px;
  left: 12px;
  right: 12px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}
.v5-start__badge {
  padding: 3px 8px;
  border-radius: 10px;
  background: var(--navy);
  color: #fff;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.35;
}
.v5-start__status {
  position: absolute;
  left: 12px;
  bottom: 60px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border-radius: 16px;
  background: #10253bd9;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.3;
}
.v5-start__pulse {
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--teal);
  animation: v5-status-pulse 1.6s var(--ease-out) infinite;
}
@keyframes v5-status-pulse {
  0%   { box-shadow: 0 0 0 0 #29b3b9b3; }
  100% { box-shadow: 0 0 0 8px #29b3b900; }
}
/* Segmentli seçici: beyaz hap, etkin dilim --teal zemin / --navy yazı */
.v5-start__switch {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  display: grid;
  grid-template-columns: auto auto;
  gap: 4px;
  padding: 4px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 4px 14px #10253b1f;
}
.v5-start__opt {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 0;
  min-height: 34px;
  padding: 5px 10px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--navy);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.15;
  text-align: center;
  cursor: pointer;
  transition: background .25s, color .25s;
}
.v5-start__opt .icon { flex: none; width: 14px; height: 14px; }
.v5-start__opt[aria-pressed="true"] { background: var(--teal); color: var(--navy); }
.v5-start__opt:focus-visible { outline: 2px solid var(--navy); outline-offset: 2px; }
/* Durumlar */
.v5-start[data-mode="upload"] .v5-start__ai,
.v5-start[data-mode="ai"] .v5-start__chip--file,
.v5-start[data-mode="ai"] .v5-scan { opacity: 0; translate: 0 -4px; }
.v5-step__desc {
  margin-top: 8px;
  padding-inline: 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}

/* ══════════════ Önce/sonra karşılaştırma (kart 03 ve #your-space) ══════════════ */
.v5-compare {
  --pos: 50%;
  /* Tutamaç merkezinin kenara en yakın konumu: yarıçap + hover büyümesi payı */
  --handle-gap: 26px;
  position: relative;
  container-type: size;
  overflow: hidden;
  isolation: isolate;
  touch-action: pan-y;
  cursor: ew-resize;
  user-select: none;
  -webkit-user-select: none;
}
.v5-compare.is-animating { transition: --pos .8s cubic-bezier(.65, 0, .35, 1); }
.v5-compare img { pointer-events: none; -webkit-user-drag: none; }
.v5-compare--card { position: absolute; inset: 0; }
.v5-compare__after { position: absolute; inset: 0; clip-path: inset(0 0 0 var(--pos)); }
.v5-compare__divider {
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--pos);
  z-index: 3;
  width: 2px;
  background: var(--teal);
  transform: translateX(-50%);
  pointer-events: none;
}
/* v3 drag-handle görünümü: turkuaz zemin, yarı saydam beyaz kenarlık, ok ikonu.
   Çizgi %0/100'e kadar gidebilir; tutamaç dairesi her zaman görselin içinde kalır. */
.v5-compare__handle {
  position: absolute;
  top: 50%;
  left: clamp(var(--handle-gap), var(--pos), 100% - var(--handle-gap));
  z-index: 4;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 3px solid #ffffffbb;
  border-radius: 50%;
  background: var(--teal);
  color: #fff;
  box-shadow: 0 3px 15px #10253b26;
  transform: translate(-50%, -50%);
  cursor: ew-resize;
  transition: transform .2s var(--ease-out), box-shadow .2s var(--ease-out);
}
.v5-compare__handle .icon { width: 23px; height: 23px; }
.v5-compare--card { --handle-gap: 23px; }
.v5-compare--card .v5-compare__handle { width: 38px; height: 38px; }
.v5-compare--card .v5-compare__handle .icon { width: 19px; height: 19px; }
.v5-compare__handle:focus-visible { outline: 3px solid var(--navy); outline-offset: 3px; }
.v5-compare.is-dragging .v5-compare__handle { box-shadow: 0 0 0 6px #29b3b933, 0 3px 15px #10253b26; }
.v5-compare .comparison-tag { z-index: 5; }

/* ══════════════ 4: #shop — v4 fotoğrafı, rozet ve işaretler ══════════════ */
/* ≥1151px: fotoğraf ızgara hücresini tam doldurur, yüksekliği panelle aynı.
   aspect-ratio yok: esnetilmiş yükseklikten genişlik türetilip panelin üstüne taşıyordu. */
.rr-page--home-v5 .v5-shop-photo {
  --pin-pad: 5px;
  --pin-dot: 14px;
  min-width: 0;
  min-height: 0;
  height: 100%;
  container-type: size;
  background: var(--cream);
}
.rr-page--home-v5 .v5-shop-photo .photo-pin {
  z-index: 2;
  flex-direction: row;
  padding: var(--pin-pad);
  /* Noktanın merkezi koordinata otursun: iç boşluk + noktanın yarısı kadar sola */
  transform: translate(calc(-1 * (var(--pin-pad) + var(--pin-dot) / 2)), -50%);
  transition: transform .25s var(--ease-out);
}
.rr-page--home-v5 .v5-shop-photo .photo-pin .pin-dot { width: var(--pin-dot); height: var(--pin-dot); }
.rr-page--home-v5 .v5-shop-photo .pin-label { transition: background .2s, color .2s, box-shadow .25s var(--ease-out); }
/* Konumlar 1536×1024 görselin tamamında ölçüldü (sahne koordinatları) */
.v5-pin-sofa  { left: 69.2%; top: 44.6%; }
.v5-pin-chair { left: 14.9%; top: 52.4%; }
.v5-pin-table { left: 41.5%; top: 61.5%; }
.v5-pin-rug   { left: 74.4%; top: 87.0%; }
.v5-pin-art   { left: 73.2%; top: 17.9%; }
/* %60'ın sağındaki işaretlerde (kanepe, halı, tablo) etiket noktanın soluna geçer */
.rr-page--home-v5 .v5-shop-photo .v5-pin--flip {
  flex-direction: row-reverse;
  transform: translate(calc(-100% + var(--pin-pad) + var(--pin-dot) / 2), -50%);
}
.v5-ai-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 13px 8px 11px;
  border-radius: 20px;
  background: #ffffffeb;
  color: var(--teal-dark);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  box-shadow: 0 4px 14px #10253b14;
  pointer-events: none;
}
.v5-ai-badge .icon { width: 15px; height: 15px; }
.rr-page--home-v5 .product-row { transition: background .2s, border-color .2s, transform .25s var(--ease-out), box-shadow .25s var(--ease-out); }
.v5-product-thumb {
  display: block;
  width: 100%;
  height: 52px;
  padding: 4px;
  border-radius: 4px;
  background: #faf9f6;
  object-fit: contain;
  transition: transform .35s var(--ease-out);
}

/* ══════════════ 5: #your-space — v4 modülü ══════════════ */
.rr-page--home-v5 .v5-space {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  box-shadow: var(--shadow);
}
.v5-compare--space {
  aspect-ratio: 792 / 560;
  border-radius: calc(var(--radius) - 2px);
  background: var(--cream);
}
/* Odadaki ürün işareti: yalnızca tepside seçilen ürün görünür */
.v5-pin {
  position: absolute;
  z-index: 2;
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: var(--teal-dark);
  box-shadow: 0 0 0 5px #29b3b937, 0 6px 14px #10253b40;
  opacity: 0;
  transform: scale(.4);
  transition: opacity .3s var(--ease-out), transform .35s var(--ease-out);
  pointer-events: none;
}
.v5-pin.is-active { opacity: 1; transform: scale(1); }
.v5-pin::after {
  content: '';
  position: absolute;
  inset: -6px;
  border: 2px solid #fff;
  border-radius: 50%;
  opacity: 0;
}
.v5-pin.is-active::after { animation: v5-pulse 1.8s var(--ease-out) .3s infinite; }
.v5-pin__label {
  position: absolute;
  bottom: calc(100% + 12px);
  left: 50%;
  padding: 6px 10px;
  border-radius: 7px;
  background: var(--navy);
  color: #fff;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.35;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  transform: translateX(-50%);
  box-shadow: 0 8px 18px #10253b33;
}
.v5-pin__label::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  border: 6px solid transparent;
  border-top-color: var(--navy);
  transform: translateX(-50%);
}
.v5-pin--sofa  { left: 46%;   top: 52%; }
.v5-pin--chair { left: 84%;   top: 62%; }
.v5-pin--table { left: 44.5%; top: 66%; }
.v5-pin--lamp  { left: 68.8%; top: 30.5%; }
.v5-pin--rug   { left: 65.5%; top: 79%; }
/* Sağ kenara yakın etiket taşmasın (v4) */
.v5-pin--chair .v5-pin__label { left: auto; right: -14px; transform: none; }
.v5-pin--chair .v5-pin__label::after { left: auto; right: 12px; transform: none; }
@keyframes v5-pulse {
  0%   { transform: scale(.6); opacity: .9; }
  100% { transform: scale(1.9); opacity: 0; }
}

.v5-tray {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0 0;
  padding: 12px;
  border-radius: calc(var(--radius) - 2px);
  background: var(--cream);
  list-style: none;
}
.v5-tray__item {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 134px;
  padding: 8px 9px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--paper);
  color: var(--navy);
  text-align: left;
  cursor: pointer;
  transition: border-color .2s, background .2s, transform .25s var(--ease-out), box-shadow .25s var(--ease-out);
}
.v5-tray__item.is-selected { border-color: var(--teal-dark); background: var(--light-teal); box-shadow: inset 0 0 0 1px var(--teal-dark); }
.v5-tray__item:focus-visible { outline: 3px solid var(--teal-dark); outline-offset: 3px; }
.v5-tray__media { display: flex; flex: 1; align-items: center; justify-content: center; min-height: 0; }
.v5-tray__media img { width: var(--img-w, auto); height: auto; max-width: 100%; max-height: 100%; object-fit: contain; }
.v5-tray__item--sofa  { --img-w: 147px; }
.v5-tray__item--chair { --img-w: 74px; }
.v5-tray__item--table { --img-w: 107px; }
.v5-tray__item--rug   { --img-w: 104px; }
.v5-tray__item--lamp .v5-tray__media img { width: auto; height: 86px; }
/* Ürün adı tam ve tek satırda (kısaltma yok), fiyat ikinci satırda */
.v5-tray__info { display: flex; flex: none; flex-direction: column; align-items: flex-start; justify-content: center; gap: 1px; min-height: 32px; }
.v5-tray__name { font-size: 12px; font-weight: 650; line-height: 1.3; white-space: nowrap; }
.v5-tray__price { color: var(--muted); font-size: 11px; line-height: 1.3; white-space: nowrap; font-variant-numeric: tabular-nums; }
.v5-tray-hint { margin: 12px 2px 0; color: var(--muted); font-size: 11px; line-height: 1.4; }
.v5-tray-hint + .v5-tray { margin-top: 6px; }

/* ══════════════ 7: #the-app — v4 telefon kartları ══════════════ */
.v5-phones {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 300px));
  justify-content: center;
  gap: 16px;
}
.v5-phone-card { display: flex; flex-direction: column; align-items: center; margin: 0; text-align: center; }
/* Telefon maketi: çerçeve PNG + ekran katmanı + dinamik ada (v4 katman düzeni, 238 birimlik ızgara) */
.v5-phone {
  position: relative;
  width: min(238px, 100%);
  aspect-ratio: 238 / 494;
  container-type: inline-size;
  transition: transform .45s var(--ease-out), filter .45s var(--ease-out);
}
.v5-phone > * { --u: calc(100cqw / 238); }
.v5-phone__frame { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.v5-phone__screen {
  position: absolute;
  left: calc(var(--u) * 9);
  top: calc(var(--u) * 8);
  width: calc(var(--u) * 220);
  height: calc(var(--u) * 479);
  overflow: hidden;
  border-radius: calc(var(--u) * 33);
  background: #faf8f6;
  box-shadow: 0 4px 6px #00000040;
}
.v5-phone__shot { position: absolute; overflow: hidden; }
.v5-phone__shot img { width: 100%; height: 100%; max-width: none; object-fit: cover; }
.v5-phone--discover .v5-phone__shot {
  left: calc(var(--u) * 3);
  top: calc(var(--u) * 18);
  width: calc(var(--u) * 213);
  height: calc(var(--u) * 461);
  border-radius: calc(var(--u) * 17);
}
/* v4'te bu ekranın üst başlığı kırpılmış */
.v5-phone--find .v5-phone__shot {
  left: calc(var(--u) * 6);
  top: calc(var(--u) * 44);
  width: calc(var(--u) * 211);
  height: calc(var(--u) * 407);
  border-radius: calc(var(--u) * 11);
}
/* Ekran görüntüsü ve fiyat etiketleri aynı kutuda: etiketler 440×954 görselin % koordinatlarında */
.v5-phone__layer {
  position: absolute;
  left: calc(var(--u) * -5.23);
  top: calc(var(--u) * -48.3);
  width: calc(var(--u) * 220.4);
  height: calc(var(--u) * 476.6);
}
.v5-phone__layer img { position: absolute; inset: 0; }

/* Find telefonundaki "ürün + fiyat" etiketleri (v3 hero etiketlerinin telefon ölçeği) */
.v5-find-tags { position: absolute; inset: 0; pointer-events: none; }
.v5-find-tag {
  position: absolute;
  display: flex;
  align-items: center;
  /* Nokta (7u) nesnenin üstüne otursun: etiket noktanın merkezinden hizalanır */
  transform: translate(calc(var(--u) * -3.5), -50%);
}
.v5-find-tag__dot {
  flex: none;
  width: calc(var(--u) * 7);
  height: calc(var(--u) * 7);
  border: calc(var(--u) * 1.5) solid #fff;
  border-radius: 50%;
  background: var(--teal);
  box-shadow: 0 0 0 calc(var(--u) * 2) #29b3b940, 0 calc(var(--u) * 1) calc(var(--u) * 3) #10253b33;
}
.v5-find-tag__line { flex: none; width: calc(var(--u) * 5); height: max(1px, calc(var(--u) * .8)); background: #ffffffd9; }
.v5-find-tag__pill {
  display: flex;
  align-items: baseline;
  gap: calc(var(--u) * 3);
  padding: calc(var(--u) * 3) calc(var(--u) * 5);
  border: 1px solid var(--line);
  border-radius: calc(var(--u) * 5);
  background: #fff;
  box-shadow: 0 calc(var(--u) * 2) calc(var(--u) * 6) #10253b26;
  font-size: calc(var(--u) * 6.4);
  line-height: 1.2;
  white-space: nowrap;
}
.v5-find-tag__pill b { color: var(--navy); font-weight: 700; }
.v5-find-tag__pill span { color: var(--muted); font-variant-numeric: tabular-nums; }
.v5-find-tag--pendant { left: 50%; top: 17.3%; }
.v5-find-tag--chair { left: 17%; top: 35.6%; }
/* Masa: etiket noktanın üstünde, ortalı */
.v5-find-tag--table {
  left: 49.5%;
  top: 30.6%;
  flex-direction: column-reverse;
  transform: translate(-50%, calc(-100% + var(--u) * 3.5));
}
.v5-find-tag--table .v5-find-tag__line { width: max(1px, calc(var(--u) * .8)); height: calc(var(--u) * 5); }
/* Kart görünür olunca etiketler sırayla "pop" eder (yalnız JS varken ve hareket tercihi açıkken) */
.rr-js .v5-phone-card:not(.is-visible) .v5-find-tag { opacity: 0; }
.rr-js .v5-phone-card.is-visible .v5-find-tag { animation: v5-tag-pop .45s var(--ease-out) backwards; }
.rr-js .v5-phone-card.is-visible .v5-find-tag:nth-child(1) { animation-delay: .45s; }
.rr-js .v5-phone-card.is-visible .v5-find-tag:nth-child(2) { animation-delay: .51s; }
.rr-js .v5-phone-card.is-visible .v5-find-tag:nth-child(3) { animation-delay: .57s; }
@keyframes v5-tag-pop {
  from { opacity: 0; scale: .85; }
  to   { opacity: 1; scale: 1; }
}
.v5-phone--visualize .v5-phone__shot {
  left: calc(var(--u) * 5);
  top: calc(var(--u) * 23);
  width: calc(var(--u) * 210);
  height: calc(var(--u) * 455);
}
.v5-phone__island {
  position: absolute;
  z-index: 2;
  left: calc(var(--u) * 86.3);
  top: calc(var(--u) * 18.85);
  width: calc(var(--u) * 65.1);
  height: calc(var(--u) * 18.9);
  border-radius: 999px;
  object-fit: cover;
}
.v5-phone-card__caption { margin-top: 18px; }
.v5-phone-card__title { font-size: 20px; font-weight: 800; letter-spacing: -.4px; }
.v5-phone-card__desc { margin-top: 6px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.v5-phones__dots { display: none; }
.v5-app-badges { margin-top: 30px; }
.v5-app-download { font-family: var(--heading); font-size: 16px; font-weight: 800; letter-spacing: -.2px; }

/* ══════════════ #pricing — krem bölüm içinde açık turkuaz kart ══════════════
   rr-revision.css'teki .rr-page--home .pricing-section/.pricing-strip { background:#fff }
   v5'te tam genişlikte beyaz bir bant yapıyordu; daha yüksek özgüllükle düzeltilir. */
.rr-page--home-v5 .pricing-section {
  padding: 56px 0;
  border-top: 0;
  border-bottom: 0;
  background: var(--cream);
}
.rr-page--home-v5 .pricing-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 32px;
  padding: 32px 40px;
  border-radius: var(--radius);
  background: var(--light-teal);
}
.rr-page--home-v5 .pricing-actions { flex-wrap: nowrap; justify-content: flex-end; gap: 20px; }

/* ══════════════ Mağaza rozetleri: büyük boy (görünür yükseklik 56px) ══════════════ */
.store-badges--lg { gap: 18px; }
.store-badges--lg .badge-img-appstore { width: 168px; height: 56px; }
.store-badges--lg .badge-img-googleplay { width: 188.3px; height: 56px; }

/* ══════════════ 10: #download — v4 iki sütunlu çağrı (Figma 1:6) ══════════════
   1440px'te: görsel 486px, sağ kenarı görüntü kenarından ~120px içeride, bölümün
   üstünden ~16px taşar. Daire 610px, görselin sağ üstünde; bölüm kenarında kırpılır.
   Bölüm yalnızca yatayda kırpar (overflow-x: clip): sayfa yatay kaymaz. */
.v5-download {
  position: relative;
  overflow-x: clip;
  padding: 75px 0 60px;
  background: var(--cream);
}
/* Daire ayrı katmanda: bölümün kendi kutusuna kırpılır (görsel ise yukarı taşabilir) */
.v5-download__bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.v5-download__circle {
  position: absolute;
  /* Görselin sol kenarı = kapsayıcı sağ kenarı − 21px − 486px; daire ondan 17px sağda */
  left: calc(50% + min(620px, 50% - 40px) - 490px);
  top: -150px;
  width: 610px;
  height: 610px;
  border-radius: 50%;
  background: var(--light-teal);
}
.v5-download__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 507px;
  align-items: start;
  column-gap: 32px;
}
.v5-download__copy h2 {
  margin-top: 4px;
  font-size: 44px;
  line-height: 1.12;
  letter-spacing: -1.6px;
}
.v5-download__desc {
  margin-top: 22px;
  max-width: 470px;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.7;
}
.v5-button-pill { margin-top: 28px; padding: 14px 26px; border-radius: 999px; gap: 12px; font-size: 16px; }
.rr-page--home-v5 .v5-button-pill { border-radius: 999px; }
.v5-download__or { margin-top: 22px; padding-left: 4px; color: var(--muted); font-size: 15px; font-weight: 600; }
.v5-download .store-badges { margin-top: 12px; }
.v5-download__note { margin-top: 14px; color: var(--muted); font-size: 14px; }
/* Görsel kutusu PNG'nin alttaki saydam payını (≈%9) kırpar: kutu footer'a hiç taşmaz.
   Üstten -91px: bölüm üstünün ~16px yukarısından başlar (Figma). */
.v5-download__visual {
  position: relative;
  justify-self: start;
  width: 486px;
  margin: -91px 21px -42px 0;
  aspect-ratio: 972 / 1340;
  overflow: hidden;
}
/* Ölçü düzeltmesi: genel img sıfırlamasında height:auto yok; HTML'deki height="1458"
   görseli dikeyde geriyordu. Oran korunur. */
.v5-download__visual img { display: block; width: 100%; height: auto; }

/* ══════════════ Hover ve hareket sistemi (yalnızca hassas işaretçi + hareket tercihi) ══════════════ */
.rr-page--home-v5 .hero-image { transition: transform 1.2s var(--ease-out); }
.rr-page--home-v5 .store-badge { transition: transform .25s var(--ease-out); }
.rr-page--home-v5 .button,
.rr-page--home-v5 .button-secondary { transition: background .2s, border-color .2s, transform .25s var(--ease-out), box-shadow .25s var(--ease-out); }
.rr-page--home-v5 a .icon,
.rr-page--home-v5 .contact-card small span { transition: transform .25s var(--ease-out); }
.rr-page--home-v5 .contact-card small span { display: inline-block; }
.rr-page--home-v5 .compare-card,
.rr-page--home-v5 .pricing-strip { transition: transform .3s var(--ease-out), box-shadow .3s var(--ease-out); }
.rr-page--home-v5 .faq-list details { transition: border-color .3s var(--ease-out); }

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .rr-page--home-v5 .button:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(41, 179, 185, .30); }
  .rr-page--home-v5 .v5-button-pill:hover { transform: translateY(-2px); }
  .rr-page--home-v5 .button-secondary:hover { border-color: var(--navy); transform: translateY(-1px); }
  /* Buton ve bağlantılardaki ok ikonu sağa kayar */
  .rr-page--home-v5 a:hover .icon:has(use[href="#i-arrow"]),
  .rr-page--home-v5 .contact-card:hover small span { transform: translateX(3px); }
  .rr-page--home-v5 .store-badge:hover { transform: translateY(-2px); }
  .rr-page--home-v5 .hero-visual:hover .hero-image { transform: scale(1.03); }

  .rr-page--home-v5 .v5-shop-photo .photo-pin:hover { transform: translate(calc(-1 * (var(--pin-pad) + var(--pin-dot) / 2)), calc(-50% - 2px)); }
  .rr-page--home-v5 .v5-shop-photo .v5-pin--flip:hover { transform: translate(calc(-100% + var(--pin-pad) + var(--pin-dot) / 2), calc(-50% - 2px)); }
  .rr-page--home-v5 .v5-shop-photo .photo-pin:hover .pin-label { box-shadow: 0 8px 18px rgba(16, 37, 59, .16); }
  .rr-page--home-v5 .product-row:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(16, 37, 59, .10); }
  .rr-page--home-v5 .product-row:hover .v5-product-thumb { transform: scale(1.06); }

  .rr-page--home-v5 .v5-step:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(16, 37, 59, .11); }
  .rr-page--home-v5 .v5-step:hover .v5-step__media > img { transform: scale(1.05); }
  .rr-page--home-v5 .v5-step--inspiration:hover .v5-step__media > img { transform: scale(1.15); }

  .rr-page--home-v5 .v5-compare:hover .v5-compare__handle,
  .rr-page--home-v5 .v5-compare.is-dragging .v5-compare__handle { transform: translate(-50%, -50%) scale(1.15); }
  .rr-page--home-v5 .v5-tray__item:hover { transform: translateY(-3px); box-shadow: 0 10px 22px rgba(16, 37, 59, .10); }
  .rr-page--home-v5 .v5-tray__item.is-selected:hover { box-shadow: inset 0 0 0 1px var(--teal-dark), 0 10px 22px rgba(16, 37, 59, .10); }
  .rr-page--home-v5 .v5-phone-card:hover .v5-phone { transform: translateY(-8px); filter: drop-shadow(0 22px 26px rgba(16, 37, 59, .16)); }

  .rr-page--home-v5 .compare-card:hover,
  .rr-page--home-v5 .pricing-strip:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(16, 37, 59, .09); }
  .rr-page--home-v5 .faq-list details:not([open]):hover { border-color: #c9ccc8; }
}

/* ── Kaydırınca belirme: gizli başlangıç yalnızca JS kök sınıfı (.rr-js) varken.
   Animasyon "backwards" dolgu kullanır; bittikten sonra hover dönüşümleri serbest kalır. ── */
.rr-js .rr-page--home-v5 [data-reveal]:not(.is-visible) { opacity: 0; }
.rr-js .rr-page--home-v5 [data-reveal].is-visible { animation: v5-reveal .7s var(--ease-out) backwards; }
.rr-js .v5-steps > [data-reveal]:nth-child(2),
.rr-js .v5-phones > [data-reveal]:nth-child(2),
.rr-js .compare-grid > [data-reveal]:nth-child(2) { animation-delay: .08s; }
.rr-js .v5-steps > [data-reveal]:nth-child(3),
.rr-js .v5-phones > [data-reveal]:nth-child(3),
.rr-js .compare-grid > [data-reveal]:nth-child(3) { animation-delay: .16s; }
@keyframes v5-reveal {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}

/* ══════════════ Duyarlı kırılımlar (v3 ile aynı) ══════════════ */
@media (max-width: 1150px) {
  /* 5 satırlık panelin yanında fotoğraf bu genişlikte çok dar/uzun kalıp işaretleri
     kırpıyordu: fotoğraf üstte tam genişlik (oranı korunur), panel altında */
  .rr-page--home-v5 .shop-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  /* Alt alta: v3'ün sabit 430/350/300px yükseklikleri yerine 3:2 */
  .rr-page--home-v5 .v5-shop-photo { height: auto; aspect-ratio: 3 / 2; }
  /* Dar başlık sütununda zorunlu satır kırılımı satır sayısını artırıyordu */
  .rr-page--home-v5 .hero h1 br { display: none; }
  /* Tepsi: 5 sütun bu genişlikte tam ürün adlarına yetmiyor (901px'te kart 69px) —
     kısaltma yerine 140px'lik yatay kaydırmalı sıra; sıra modül içinde kayar */
  .v5-tray {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 12px;
    scrollbar-width: none;
  }
  .v5-tray::-webkit-scrollbar { display: none; }
  .v5-tray > li { flex: 0 0 140px; scroll-snap-align: start; }
  .v5-steps { gap: 14px; }
  .v5-step__title { font-size: 18px; }
  .v5-download__copy h2 { font-size: 38px; }
}

@media (min-width: 901px) and (max-width: 1150px) {
  /* Görsel 380px, daire 480px; kapsayıcı burada calc(100% - 64px) (rr-revision) */
  .v5-download { padding: 64px 0 56px; }
  .v5-download__grid { grid-template-columns: minmax(0, 1fr) 396px; column-gap: 28px; }
  .v5-download__visual { width: 380px; margin: -76px 16px -32px 0; }
  .v5-download__circle { left: calc(100% - 415px); top: -117px; width: 480px; height: 480px; }
}

@media (max-width: 900px) {
  /* Adım kartları: yatay kaydırmalı sıra, kart genişliği ≈ %85 */
  .v5-steps {
    display: flex;
    gap: 14px;
    margin-inline: -8px;
    padding: 6px 8px 18px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-inline: 8px;
    scrollbar-width: none;
  }
  .v5-steps::-webkit-scrollbar { display: none; }
  .v5-steps > .v5-step { flex: 0 0 min(85%, 340px); scroll-snap-align: start; }
  /* Kart 01 çipleri küçülür */
  .v5-start__chip { padding: 5px 9px 5px 7px; font-size: 11px; }
  .v5-start__chip .icon { width: 13px; height: 13px; }
  .v5-start__chip--file, .v5-start__ai { top: 10px; left: 10px; }
  .v5-start__badge { font-size: 10px; }
  .v5-start__status { left: 10px; bottom: 54px; padding: 5px 9px; font-size: 10.5px; }
  .v5-start__switch { left: 10px; right: 10px; bottom: 10px; padding: 3px; gap: 3px; }
  .v5-start__opt { min-height: 32px; padding: 4px 8px; gap: 5px; font-size: 11px; }
  .v5-start__opt .icon { width: 13px; height: 13px; }

  /* Fiyat şeridi: alt alta, buton tam genişlik */
  .rr-page--home-v5 .pricing-section { padding: 40px 0; }
  .rr-page--home-v5 .pricing-strip { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 26px 22px; }
  .rr-page--home-v5 .pricing-actions { flex-direction: column; flex-wrap: wrap; align-items: stretch; }
  .rr-page--home-v5 .pricing-actions .button { width: 100%; }
  .rr-page--home-v5 .pricing-actions .text-link { justify-content: center; min-height: 44px; }

  /* Telefonlar: ortalanmış kaydırmalı karusel + noktalar */
  .v5-phones {
    display: flex;
    justify-content: flex-start;
    gap: 18px;
    padding: 8px calc(50% - 125px) 10px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .v5-phones::-webkit-scrollbar { display: none; }
  .v5-phone-card { flex: 0 0 250px; scroll-snap-align: center; }
  .v5-phones__dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
  .v5-phones__dot {
    position: relative;
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background: #c9ccc8;
    cursor: pointer;
    transition: width .3s var(--ease-out), background .3s;
  }
  .v5-phones__dot.is-active { width: 24px; background: var(--teal-dark); }
  /* Dokunma alanını büyüt */
  .v5-phones__dot::before { content: ''; position: absolute; inset: -14px -6px; }

  /* Son çağrı: görsel metnin altında, ortalı */
  /* Alt alta: görsel en fazla 300px, ortalı, oranı korunur; negatif alt boşluk yok.
     PNG'nin alttaki saydam payı bölümün alt boşluğu olarak kalır. */
  .v5-download { padding: 56px 0 0; }
  .v5-download__bg { display: none; }
  .v5-download__grid { grid-template-columns: minmax(0, 1fr); gap: 36px; text-align: center; }
  .v5-download__copy { display: flex; flex-direction: column; align-items: center; }
  .v5-download__desc { margin-inline: auto; }
  .v5-download__or { padding-left: 0; }
  .v5-download .store-badges { justify-content: center; }
  .v5-download__visual {
    isolation: isolate;
    justify-self: center;
    width: 100%;
    max-width: 300px;
    margin: 0;
    aspect-ratio: auto;
    overflow: visible;
  }
  /* 360px daire, görselin üst yarısının arkasında ortalı */
  .v5-download__visual::before {
    content: '';
    position: absolute;
    z-index: -1;
    left: 50%;
    top: 30%;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: var(--light-teal);
    transform: translate(-50%, -50%);
  }
}

@media (max-width: 700px) {
  .rr-page--home-v5 .v5-shop-photo { --pin-dot: 13px; }
  /* Fotoğraftaki ipucu en fazla 140px, gerekirse iki satır: sağ alttaki halı etiketiyle çakışmaz */
  .rr-page--home-v5 .v5-shop-photo .photo-hint { max-width: 140px; border-radius: 12px; line-height: 1.3; }
  /* Revizyon bu genişlikte "Illustrative matches" notunu sol üste taşıyor: çip sağ üstte */
  .v5-hero-chip { top: 12px; left: auto; right: 12px; max-width: 160px; gap: 6px; padding: 6px 11px 6px 7px; border-radius: 14px; font-size: 11px; line-height: 1.25; }
  .v5-hero-chip .icon { width: 18px; height: 18px; }
  .v5-ai-badge { top: 10px; left: 10px; padding: 6px 10px 6px 9px; font-size: 10px; }
  .v5-ai-badge .icon { width: 13px; height: 13px; }

  .rr-page--home-v5 .preview-media.v5-space { padding: 10px; }
  .v5-compare--space { aspect-ratio: 4 / 3.4; }
  .v5-compare--space { --handle-gap: 24px; }
  .v5-compare__handle { width: 40px; height: 40px; }
  .v5-tray { gap: 8px; padding: 10px; }
  .v5-tray__item { height: 116px; }
  .v5-pin__label { padding: 5px 8px; font-size: 11px; }

  .v5-step__title { font-size: 19px; }
  .v5-download__copy h2 { font-size: 31px; letter-spacing: -1px; }
  .v5-download__desc { font-size: 15px; }
  .v5-button-pill { width: 100%; max-width: 340px; }
  .store-badges--lg .badge-img-appstore { width: 144px; height: 48px; }
  .store-badges--lg .badge-img-googleplay { width: 161.4px; height: 48px; }
  .store-badges--lg { gap: 10px; }
}

@media (max-width: 370px) {
  .rr-page--home-v5 .v5-shop-photo { height: auto; }
  .store-badges--lg .badge-img-appstore { width: 126px; height: 42px; }
  .store-badges--lg .badge-img-googleplay { width: 141.2px; height: 42px; }
}

/* Hareket azaltma: belirme ve nabız animasyonları kapalı, içerik hemen görünür */
@media (prefers-reduced-motion: reduce) {
  .rr-js .rr-page--home-v5 [data-reveal]:not(.is-visible) { opacity: 1; }
  .rr-js .rr-page--home-v5 [data-reveal].is-visible { animation: none; }
  .rr-js .v5-phone-card:not(.is-visible) .v5-find-tag { opacity: 1; }
  .rr-js .v5-phone-card.is-visible .v5-find-tag { animation: none; }
  .rr-js .v5-hero-chip:not(.is-in) { opacity: 1; }
  .rr-js .v5-hero-chip.is-in { animation: none; }
  .v5-start__pulse { animation: none; }
  .v5-pin.is-active::after { animation: none; }
}