/* iletisim sayfa stilleri. Hero blogu medikal-estetik.css'teki onayli about
   hero'nun kopyasi (aile standardi). CF7 form koprusu (.rg-cf7) SITE GENELI
   custom.css'te durur (popup 81 basvuru formu da ayni koprusu kullanir);
   burada yalniz sayfaya ozel bolum duzenleri var. Desen ozeti:
   notlar/05-tasarim-dili.md */

    /* ── Bölüm ritmi (aile standardı: 10px bant araları) ── */
    #iletisim-formu,
    #iletisimVizyon {
      padding-top: var(--page-gutter);
      padding-bottom: var(--page-gutter);
    }

    /* ── ABOUT SPLIT HERO (medikal-estetik.css kopyası) ── */
    .rg-about-hero-section {
      height: 80svh;
      padding: 10px;
    }

    .rg-about-hero {
      position: relative;
      height: 100%;
      overflow: hidden;
      isolation: isolate;
      border-radius: 24px;
      background: #00091f;
      color: #fff;
    }

    .rg-about-hero::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      background: rgba(0, 9, 31, 0.34);
      pointer-events: none;
    }

    .rg-about-hero::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      background-image:
        linear-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
      background-size: 92px 92px;
      opacity: 0.18;
      -webkit-mask-image: linear-gradient(90deg, #000 0%, transparent 78%);
      mask-image: linear-gradient(90deg, #000 0%, transparent 78%);
      pointer-events: none;
    }

    .rg-about-hero__image {
      position: absolute;
      inset: 0;
      z-index: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      pointer-events: none;
      user-select: none;
      -webkit-user-drag: none;
    }

    .rg-about-hero .hero-split-layout {
      position: relative;
      z-index: 3;
      display: flex;
      width: 100%;
      min-height: calc(80svh - 20px);
      flex-flow: row wrap;
      align-items: stretch;
      justify-content: space-between;
      gap: 40px;
      padding: 60px 60px clamp(40px, 8vh, 80px);
    }

    .rg-about-hero .hero-split-left {
      display: flex;
      min-width: 320px;
      flex: 1 1 50%;
      flex-direction: column;
      align-self: stretch;
      justify-content: space-between;
    }

    .rg-about-hero .hero-split-left__top {
      padding-top: 120px;
    }

    .rg-about-hero .hero-title {
      max-width: 780px;
      margin: 0;
      color: #fff;
      font-size: clamp(42px, 5.7vw, 72px);
      font-weight: 600;
      line-height: 1.1;
      letter-spacing: -2px;
      text-shadow: none;
    }

    .rg-about-hero .hero-title__line--muted {
      color: rgba(255, 255, 255, 0.72);
      font-weight: 400;
    }

    .rg-about-hero .hero-split-right {
      display: flex;
      min-width: 320px;
      flex: 1 1 40%;
      flex-direction: column;
      align-self: flex-end;
      align-items: flex-end;
      justify-content: flex-end;
    }

    .rg-about-hero .hero-split-right__inner {
      width: 100%;
      max-width: 480px;
    }

    .rg-about-hero .hero-split-right .hero-subline {
      max-width: 480px;
      margin: 0 0 24px;
      color: rgba(255, 255, 255, 0.72);
      font-size: clamp(16px, 1.2vw, 18px);
      font-weight: 300;
      line-height: 1.6;
    }

    .rg-about-hero .hero-split-right .hero-actions {
      justify-content: flex-start;
      margin: 0;
    }

    .rg-about-breadcrumb {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
      margin: 0;
      padding: 0;
      color: rgba(255, 255, 255, 0.56);
      font-size: 13px;
      font-weight: 400;
      letter-spacing: 0.02em;
      list-style: none;
    }

    .rg-about-breadcrumb__item a {
      color: rgba(255, 255, 255, 0.56);
      text-decoration: none;
      transition: color 0.2s ease;
    }

    .rg-about-breadcrumb__item a:hover {
      color: #fff;
    }

    .rg-about-breadcrumb__item[aria-current="page"] {
      color: rgba(255, 255, 255, 0.92);
    }

    .rg-about-breadcrumb__sep {
      color: rgba(255, 255, 255, 0.32);
    }

    @media (max-width: 1024px) {
      .rg-about-hero-section {
        height: auto;
        min-height: 80svh;
      }

      .rg-about-hero .hero-split-layout {
        flex-direction: column;
        justify-content: center;
        gap: 48px;
        padding: 130px 40px 48px;
      }

      .rg-about-hero .hero-split-left,
      .rg-about-hero .hero-split-right {
        min-width: 0;
        flex: none;
        align-self: flex-start;
        align-items: flex-start;
      }

      .rg-about-hero .hero-split-left {
        gap: 48px;
      }

      .rg-about-hero .hero-split-left__top {
        padding-top: 0;
      }
    }

    @media (max-width: 560px) {
      .rg-about-hero .hero-split-layout {
        gap: 36px;
        padding: 112px 24px 36px;
      }

      .rg-about-hero .hero-title {
        font-size: clamp(38px, 12vw, 54px);
        letter-spacing: -1.5px;
      }

      .rg-about-breadcrumb {
        display: none;
      }
    }

    /* Tek eylem butonlu hero: site.css'in ≤860 genel gizlemesini ez. */
    .rg-about-hero .hero-actions > .hero-cta-secondary {
      display: inline-flex;
    }

    /* ── Ortak bölüm tipografisi (yenilenme deseninden, ID kapsamlı) ── */
    #iletisim-formu .second-section__shell,
    #iletisimVizyon .second-section__shell {
      position: relative;
      padding: clamp(62px, 5.5vw, 92px) var(--hero-content-x);
      overflow: hidden;
      background: #fff;
      color: var(--brand-navy);
    }

    #iletisim-formu .second-section__kicker,
    #iletisimVizyon .second-section__kicker {
      margin-bottom: 26px;
      color: var(--brand-blue);
      font-size: 12px;
      font-weight: 600;
      line-height: 1;
      letter-spacing: 0.16em;
      text-transform: uppercase;
    }

    #iletisim-formu .second-section__title,
    #iletisimVizyon .second-section__title {
      max-width: 780px;
      margin: 0;
      color: var(--brand-navy);
      font-size: clamp(34px, 4.2vw, 56px);
      font-weight: 500;
      line-height: 1.05;
      letter-spacing: -0.025em;
    }

    #iletisim-formu .second-section__title span,
    #iletisimVizyon .second-section__title span {
      display: block;
      color: var(--brand-blue);
    }

    /* ── FORM BÖLÜMÜ ── */
    #iletisim-formu .rg-form-shell {
      background: var(--surface-paper);
    }

    #iletisim-formu .rg-form-head {
      margin-bottom: 56px;
    }

    #iletisim-formu .rg-form-grid {
      display: grid;
      grid-template-columns: minmax(320px, 0.82fr) minmax(0, 1.18fr);
      gap: 12px;
      align-items: stretch;
    }

    /* Bilgi paneli: lacivert kart, hero'nun ızgara dokusuyla */
    #iletisim-formu .rg-form-info {
      position: relative;
      display: flex;
      flex-direction: column;
      padding: 44px 40px;
      overflow: hidden;
      isolation: isolate;
      border-radius: 18px;
      background: var(--brand-navy);
      color: #fff;
    }

    #iletisim-formu .rg-form-info::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      background-image:
        linear-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
      background-size: 92px 92px;
      opacity: 0.16;
      -webkit-mask-image: linear-gradient(180deg, transparent 30%, #000 100%);
      mask-image: linear-gradient(180deg, transparent 30%, #000 100%);
      pointer-events: none;
    }

    #iletisim-formu .rg-form-info > * {
      position: relative;
      z-index: 1;
    }

    #iletisim-formu .rg-form-info__title {
      margin: 0 0 16px;
      color: #fff;
      font-size: 24px;
      font-weight: 500;
      line-height: 1.2;
      letter-spacing: -0.02em;
    }

    #iletisim-formu .rg-form-info__copy {
      margin: 0 0 36px;
      color: rgba(255, 255, 255, 0.72);
      font-size: 15.5px;
      font-weight: 300;
      line-height: 1.65;
      letter-spacing: -0.1px;
    }

    #iletisim-formu .rg-form-info__rows {
      display: flex;
      flex-direction: column;
      gap: 24px;
      margin-bottom: 36px;
    }

    #iletisim-formu .rg-form-info__row {
      display: flex;
      align-items: flex-start;
      gap: 14px;
    }

    #iletisim-formu .rg-form-info__row svg {
      width: 20px;
      height: 20px;
      margin-top: 2px;
      flex-shrink: 0;
      color: var(--brand-cyan);
    }

    #iletisim-formu .rg-form-info__row-label {
      display: block;
      margin-bottom: 6px;
      color: rgba(255, 255, 255, 0.45);
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }

    #iletisim-formu .rg-form-info__row-value {
      margin: 0;
      color: rgba(255, 255, 255, 0.88);
      font-size: 15.5px;
      font-weight: 300;
      line-height: 1.55;
      letter-spacing: -0.1px;
    }

    #iletisim-formu .rg-form-info__row-value a {
      color: rgba(255, 255, 255, 0.88);
      text-decoration: none;
      transition: color 0.2s ease;
    }

    #iletisim-formu .rg-form-info__row-value a:hover {
      color: var(--brand-cyan);
    }

    /* Yol tarifi: adres satırının altında küçük dış bağlantı */
    #iletisim-formu .rg-form-info__map {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      margin-top: 10px;
      color: var(--brand-cyan);
      font-size: 13px;
      font-weight: 500;
      text-decoration: none;
      transition: color 0.2s ease;
    }

    #iletisim-formu .rg-form-info__map:hover {
      color: #fff;
    }

    #iletisim-formu .rg-form-info__map svg {
      width: 12px;
      height: 12px;
      margin-top: 0;
      fill: currentColor;
      transition: transform 0.28s cubic-bezier(0.19, 1, 0.22, 1);
    }

    #iletisim-formu .rg-form-info__map:hover svg {
      transform: translateX(2px);
    }

    /* Bölge temsilcileri (kanallar kartından yedirildi; panelin son bloğu).
       margin-top: auto: eşit yükseklik esnemesinin kalanı kartın dibinde
       ölü boşluk olarak kalmasın, blok tabana yaslansın. */
    #iletisim-formu .rg-form-info__regions {
      display: flex;
      flex-direction: column;
      margin-top: auto;
      margin-bottom: 0;
      padding-top: 22px;
    }

    /* Ayirici cizgi basligin ALTINDA (kullanici tercihi) */
    #iletisim-formu .rg-form-info__regions > .rg-form-info__row-label {
      margin-bottom: 8px;
      padding-bottom: 12px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    }

    #iletisim-formu .rg-form-info__region {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 0;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      text-decoration: none;
    }

    #iletisim-formu .rg-form-info__region:last-child {
      border-bottom: 0;
      padding-bottom: 0;
    }

    /* Artı ikonu: ana sayfa hotspot__plus dili (açık mavi stroke) */
    #iletisim-formu .rg-form-info__region-plus {
      width: 12px;
      height: 12px;
      flex-shrink: 0;
      display: block;
    }

    #iletisim-formu .rg-form-info__region-plus path {
      fill: none;
      stroke: var(--brand-cyan);
      stroke-width: 2.6;
      stroke-linecap: round;
    }

    #iletisim-formu .rg-form-info__region-label {
      color: rgba(255, 255, 255, 0.62);
      font-size: 14.5px;
      font-weight: 300;
      letter-spacing: -0.1px;
    }

    #iletisim-formu .rg-form-info__region-value {
      margin-left: auto;
      color: rgba(255, 255, 255, 0.92);
      font-size: 14.5px;
      font-weight: 500;
      white-space: nowrap;
      transition: color 0.2s ease;
    }

    #iletisim-formu .rg-form-info__region:hover .rg-form-info__region-value {
      color: var(--brand-cyan);
    }

    /* Form paneli: beyaz kart */
    #iletisim-formu .rg-form-panel {
      padding: 44px 40px;
      border: 1px solid var(--surface-line);
      border-radius: 18px;
      background: #fff;
    }

    /* ── VİZYON (yenilenme deseni, ID kapsamlı) ── */
    #iletisimVizyon .second-section__intro-grid {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: minmax(0, 0.98fr) minmax(360px, 0.72fr);
      gap: 0;
      align-items: start;
    }

    #iletisimVizyon .second-section__heading {
      grid-column: 1;
      grid-row: 1;
      max-width: 760px;
    }

    #iletisimVizyon .second-section__lead-group {
      grid-column: 2;
      grid-row: 2;
      display: grid;
      gap: 24px;
      max-width: 100%;
    }

    #iletisimVizyon .second-section__lead {
      display: block;
      max-width: 100%;
      margin: 0;
      padding: 0;
      color: rgba(0, 20, 66, 0.48);
      font-size: 24px;
      font-weight: 300;
      line-height: 1.6;
      letter-spacing: -0.5px;
      text-align: left;
      white-space: normal;
    }

    #iletisimVizyon .second-section__lead strong {
      color: var(--brand-ink);
      font-weight: 400;
    }

    #iletisimVizyon .vision-aside {
      display: flex;
      min-width: 0;
      max-width: 500px;
      flex-direction: column;
      align-self: stretch;
      padding-top: 40px;
    }

    #iletisimVizyon .vision-aside-copy {
      margin-top: 12px;
      margin-bottom: 24px;
      max-width: 450px;
      color: rgba(0, 20, 66, 0.56);
      font-size: 18px;
      font-weight: 300;
      line-height: 1.4;
      letter-spacing: -0.2px;
    }

    #iletisimVizyon .vision-aside-copy strong {
      color: var(--brand-navy);
      font-weight: 500;
    }

    #iletisimVizyon .hero-cta-secondary {
      align-items: center;
      gap: 9px;
      font-size: 15px;
      font-weight: 500;
    }

    #iletisimVizyon .hero-cta-secondary svg {
      width: 14px;
      height: 14px;
      fill: currentColor;
      transition: transform 0.28s cubic-bezier(0.19, 1, 0.22, 1);
    }

    #iletisimVizyon .vision-aside .hero-cta-secondary--dark {
      display: inline-flex;
      text-decoration: none;
    }

    .hero-cta-secondary--dark {
      color: var(--brand-navy);
    }

    .hero-cta-secondary--dark .button__text {
      position: relative;
    }

    .hero-cta-secondary--dark .button__text::after {
      content: "";
      position: absolute;
      bottom: -4px;
      left: 0;
      width: 100%;
      height: 1px;
      background-color: currentColor;
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }

    .hero-cta-secondary--dark:hover .button__text::after {
      transform: scaleX(1);
    }

    /* ── 1024: form ızgarası tek kolon ── */
    @media (max-width: 1024px) {
      #iletisim-formu .rg-form-grid {
        grid-template-columns: 1fr;
      }

      #iletisim-formu .rg-form-info {
        min-height: 0;
      }
    }

    /* ── 860 ── */
    @media (max-width: 860px) {
      #iletisim-formu .second-section__shell,
      #iletisimVizyon .second-section__shell {
        min-height: auto;
        padding: 64px var(--hero-content-x);
      }

      #iletisim-formu .rg-form-head {
        margin-bottom: 34px;
      }

      #iletisimVizyon .second-section__intro-grid {
        grid-template-columns: 1fr;
        gap: 34px;
      }

      #iletisimVizyon .second-section__heading,
      #iletisimVizyon .second-section__lead-group {
        grid-column: 1;
        grid-row: auto;
      }

      #iletisimVizyon .second-section__lead {
        max-width: 100%;
        text-align: left;
      }

      #iletisimVizyon .vision-aside {
        padding-top: 0;
      }
    }

    /* ── 560: mobil hiza (30px) + tipografi standardı ── */
    @media (max-width: 560px) {
      #iletisim-formu .second-section__shell,
      #iletisimVizyon .second-section__shell {
        padding: 54px 30px;
      }

      #iletisim-formu .second-section__title,
      #iletisimVizyon .second-section__title {
        font-size: 38px;
        letter-spacing: -2px;
      }

      #iletisim-formu .rg-form-info,
      #iletisim-formu .rg-form-panel {
        padding: 32px 24px;
      }

      /* Dar ekran guvencesi: bolge satiri sigmazsa numara alta sarar
         (margin-left: auto sag hizayi korur), metinler carpismaz. */
      #iletisim-formu .rg-form-info__region {
        flex-wrap: wrap;
        row-gap: 2px;
      }

      /* Battaniye kural: mobilde tüm paragraflar 16px (aile standardı).
         ID+class özgüllü istisnalar da 16'ya çekilir. */
      #iletisim-formu p,
      #iletisimVizyon p {
        font-size: 16px;
        font-weight: 300;
        letter-spacing: -0.02em;
        line-height: 1.6;
      }

      #iletisimVizyon .second-section__lead,
      #iletisimVizyon .vision-aside-copy,
      #iletisim-formu .rg-form-info__copy,
      #iletisim-formu .rg-form-info__row-value {
        font-size: 16px;
      }
    }
