/* ═══════════════════════════════════════════════════════════════════════
   REVIEW HERO — ORTAK KABUK (rozet · başlık · metin · illüstrasyon)

   ⛔⛔ NEDEN AYRI DOSYA: bu kurallar `dashboard/css/company-onboarding.css`
   içindeydi ve o dosyayı YALNIZ `onboarding_assets.html` yüklüyor
   (`home.html` + `company_documents.html`). `company_settings.html`
   YÜKLEMİYOR — hero dilini ayarlar sayfasına taşıyan her markup orada
   STİLSİZ inerdi. §16.1'in "eksik yükleme" biçimi; bu projede
   `cc_confirm_modal.css` ve `cc_verify_action.css` ile iki kez ödendi.

   ⛔ TAŞINDI, KOPYALANMADI (2026-09-13). Kurallar kaynaktan SİLİNDİ.
   İki dosyada birden dursaydı biri düzeltilip öteki unutulurdu — §16.1'in
   "kopya tanım" biçimi (`cc-card-header` iki dosyada, biri ötekini ezmişti).

   ⛔ TAŞIMA ÖLÇÜLDÜ, GÖZLE YAPILMADI: 47 kural bloğu, kaynakta kalan hero
   bloğu 0, ayraç dengesi korunmuş, taşınan sayı = bulunan sayı. Ölçüm
   betiğinin KENDİSİ de ölçüldü — ilk sürümü yorum haritasını silinmiş
   metne ESKİ ofsetlerle uyguluyordu ve 26 bloğu "kayıp" gösteriyordu.

   ⛔ KASKAD: taşımadan önce ölçüldü — `company-onboarding.css` içinde hero
   ile hero-dışı blokların ORTAK SEÇİCİSİ YOK (0 çakışma) ve hero
   sınıflarını tanımlayan başka dosya YOK. Bu yüzden dosya sınırı
   değiştirmek görünümü değiştirmiyor.

   ⚠️ YÜKLEYİCİ `base.html` — yeni bir ekran hero dilini kullanmak için
   hiçbir şey eklemek zorunda değil. Ekran başına include, bu dosyanın
   var olma sebebini geri alırdı.

   ⚠️ MEDIA SARMALLARI KORUNDU: 31 koşulsuz + 3 (≤1199.98) + 7 (≤991.98)
   + 6 (≤767.98). ≤767.98'de `.cc-review-hero-art { display:none }` —
   yani 380px'te illüstrasyon düşer ve hero tek sütuna iner. Revizyon
   hero'su bunu MİRAS ALIR; ayrı bir mobil kuralı yazılmaz.
   ═══════════════════════════════════════════════════════════════════════ */

/* CC REVIEW PREMIUM V1 START */

  .cc-review-hero {
    position: relative;
    overflow: hidden;
    min-height: 390px;
    padding: 34px 38px 0;
    border: 1px solid #e7ecf3;
    border-radius: 22px;
    background:
      radial-gradient(circle at 78% 22%, rgba(255, 139, 0, .07), transparent 30%),
      linear-gradient(135deg, #ffffff 0%, #fbfcfe 58%, #f6f8fb 100%);
    box-shadow:
      0 18px 50px rgba(15, 39, 66, .08),
      0 2px 8px rgba(15, 39, 66, .04);
    isolation: isolate;
  }

  .cc-review-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background:
      linear-gradient(
        90deg,
        rgba(255, 255, 255, 1) 0%,
        rgba(255, 255, 255, .98) 34%,
        rgba(255, 255, 255, .72) 51%,
        rgba(255, 255, 255, .08) 72%
      );
  }

  .cc-review-hero-art {
    position: absolute;
    top: 0;
    right: -1%;
    bottom: 92px;
    width: 72%;
    z-index: -3;
    background-image:
      url("/static/dashboard/img/company-verification-review-hero.431ad523dee0.png");
    background-repeat: no-repeat;
    background-position: right center;
    background-size: auto 112%;
    opacity: 1;
    pointer-events: none;
  }

  .cc-review-hero-content {
    position: relative;
    z-index: 2;
    width: 48%;
    max-width: 570px;
    padding-bottom: 30px;
  }

  .cc-review-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 22px;
    padding: 9px 14px;
    border: 1px solid rgba(255, 132, 0, .18);
    border-radius: 999px;
    color: #173655;
    background: rgba(255, 132, 0, .09);
    font-size: 13px;
    font-weight: 700;
  }

  .cc-review-kicker i {
    color: #ff8500;
  }

  .cc-review-hero h1 {
    max-width: 510px;
    margin: 0 0 20px;
    color: #062b4d;
    font-size: clamp(31px, 3vw, 48px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -.8px;
  }

  .cc-review-lead {
    max-width: 500px;
    margin: 0;
    color: #577087;
    font-size: 16px;
    line-height: 1.75;
  }

  /* CC REVIEW PREMIUM V1 END */

/* CC STEP 4 STEP 5 PREMIUM V1 START */

  .cc-review-hero--warning {
    background:
      radial-gradient(circle at 77% 20%, rgba(255, 143, 0, .12), transparent 31%),
      linear-gradient(135deg, #ffffff 0%, #fffdf9 55%, #fff8ee 100%);
  }

  .cc-review-hero--warning::before {
    background:
      linear-gradient(
        90deg,
        rgba(255, 255, 255, 1) 0%,
        rgba(255, 255, 255, .98) 35%,
        rgba(255, 255, 255, .76) 52%,
        rgba(255, 255, 255, .12) 73%
      );
  }

  .cc-review-kicker--warning {
    color: #7b4a00;
    border-color: rgba(255, 143, 0, .28);
    background: rgba(255, 143, 0, .12);
  }

  .cc-review-kicker--warning i,
  .cc-review-statuses .is-warning i {
    color: var(--cc-action-text);
  }

  /* CC STEP 6 DOCUMENT THUMBNAIL V1 END */

/* CC STEP 1 PREMIUM V2 START */

.cc-review-hero--email {
  background:
    radial-gradient(
      circle at 78% 24%,
      rgba(255, 143, 0, .09),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #ffffff 0%,
      #fbfcfe 58%,
      #f6f8fb 100%
    );
}

.cc-review-hero--email::before {
  background:
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 1) 0%,
      rgba(255, 255, 255, .98) 40%,
      rgba(255, 255, 255, .82) 58%,
      rgba(255, 255, 255, .22) 78%
    );
}

.cc-review-hero-art--email {
  top: 0;
  right: 1%;
  bottom: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48%;
  background-image: none;
}

/* CC STEP 1 SUMMARY CLEANUP V1 END */

/* CC STEP 4 COMPANY INFORMATION PREMIUM V1 START */

.cc-review-hero--company-info {
  background:
    radial-gradient(
      circle at 79% 22%,
      rgba(255, 143, 0, .09),
      transparent 31%
    ),
    linear-gradient(
      135deg,
      #ffffff 0%,
      #fbfcfe 58%,
      #f6f8fb 100%
    );
}

.cc-review-hero--company-info::before {
  background:
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 1) 0%,
      rgba(255, 255, 255, .98) 39%,
      rgba(255, 255, 255, .8) 58%,
      rgba(255, 255, 255, .18) 78%
    );
}

.cc-review-hero-art--company-info {
  top: 0;
  right: 1%;
  bottom: 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 49%;
  background-image: none;
}

.cc-company-info-visual {
  position: relative;
  width: 320px;
  height: 232px;
  border: 1px solid #e4ebf3;
  border-radius: 32px;
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, .98),
      rgba(244, 248, 252, .96)
    );
  box-shadow:
    0 30px 65px rgba(15, 39, 66, .14),
    0 5px 16px rgba(15, 39, 66, .06);
  transform: rotate(-2deg);
}

.cc-company-info-visual::before,
.cc-company-info-visual::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
}

.cc-company-info-visual::before {
  top: -30px;
  right: -24px;
  width: 108px;
  height: 108px;
  background: rgba(255, 143, 0, .11);
}

.cc-company-info-visual::after {
  bottom: -24px;
  left: -30px;
  width: 84px;
  height: 84px;
  background: rgba(11, 82, 124, .08);
}

.cc-company-info-visual-building {
  position: absolute;
  top: 54px;
  left: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 184px;
  height: 128px;
  border: 2px solid #dfe8f1;
  border-radius: 25px;
  color: #0b385e;
  background: #fff;
  box-shadow: 0 20px 45px rgba(15, 39, 66, .12);
  font-size: 66px;
}

.cc-company-info-visual-document {
  position: absolute;
  top: 28px;
  right: 31px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 62px;
  height: 62px;
  border: 6px solid #fff;
  border-radius: 18px;
  color: #fff;
  background: linear-gradient(135deg, #0b527c, #073957);
  box-shadow: 0 12px 28px rgba(11, 82, 124, .22);
  font-size: 22px;
}

.cc-company-info-visual-check {
  position: absolute;
  right: 54px;
  bottom: 32px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border: 6px solid #fff;
  border-radius: 50%;
  color: #fff;
  background: linear-gradient(135deg, var(--cc-action), var(--cc-action-hover));
  box-shadow: 0 12px 28px rgba(255, 126, 0, .24);
  font-size: 17px;
}

.cc-step5-hero .cc-review-kicker {
  color: #c96300;
  border-color: #ffddb3;
  background: #fff5e8;
}

.cc-step5-hero .cc-review-lead {
  max-width: 580px;
  color: #60738b;
}

.cc-review-kicker--revision {
  color: #b55b00;
  border-color: #ffd5a0;
  background: #fff0dc;
}

.cc-review-kicker--revision i {
  color: var(--cc-action-text);
}

.cc-company-info-visual--revision {
  border-color: #f0dfc9;
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, .99),
      rgba(255, 248, 237, .97)
    );
}

.cc-company-info-visual-check--revision {
  background:
    linear-gradient(
      135deg,
      #f29a1a 0%,
      #e87300 100%
    );
  box-shadow:
    0 12px 28px rgba(232, 115, 0, .25);
}

@media (max-width: 1199.98px) {
      .cc-review-hero {
        min-height: 370px;
      }

      .cc-review-hero-content {
        width: 52%;
      }

      .cc-review-hero-art {
        width: 68%;
        opacity: .9;
      }
}

@media (max-width: 991.98px) {
      .cc-review-hero {
        min-height: auto;
        padding: 32px 28px 0;
      }

      .cc-review-hero::before {
        background: rgba(255, 255, 255, .86);
      }

      .cc-review-hero-art {
        right: -10%;
        bottom: 165px;
        width: 78%;
        opacity: .2;
      }

      .cc-review-hero-content {
        width: 100%;
        max-width: 650px;
      }

    .cc-review-hero-art--email {
      right: -6%;
      bottom: 165px;
      width: 54%;
      opacity: .18;
    }

    .cc-review-hero-art--company-info {
      right: -6%;
      bottom: 165px;
      width: 55%;
      opacity: .18;
    }

    .cc-company-info-visual {
      transform: scale(.88) rotate(-2deg);
    }
}

@media (max-width: 767.98px) {
      .cc-review-hero {
        padding: 25px 20px 0;
        border-radius: 17px;
      }

      .cc-review-hero-art {
        display: none;
      }

      .cc-review-hero h1 {
        font-size: 31px;
        letter-spacing: -.4px;
      }

      .cc-review-lead {
        font-size: 14px;
      }

    .cc-review-hero-art--email {
      display: none;
    }

    .cc-review-hero-art--company-info {
      display: none;
    }
}



/* ═══════════════════════════════════════════════════════════════════════
   REVİZYON HERO — YALNIZ YENİ OLAN SINIFLAR (§14.44, 2026-09-13)

   ⛔ ROZET, İLLÜSTRASYON VE KABUK YENİDEN YAZILMADI: partial
   `--revision` ailesini (yukarıda) ve `--company-info` kabuğunu
   kullanıyor. Burada yalnız o ailede KARŞILIĞI OLMAYAN parçalar var.
   ═══════════════════════════════════════════════════════════════════════ */

/* Sayaç rozetin İÇİNDE — ayrı bir satır açılmadı. "1 / 2" rozetin
   söylediği şeyin niceliği; ayrı basılsaydı kullanıcı aynı bilgiyi iki
   yerde okur ve ikisi ayrışabilirdi (§10.2.2). */
.cc-review-kicker-sayac {
  margin-left: 4px;
  padding: 1px 8px;
  border-radius: 999px;
  background: rgba(226, 123, 0, .16);
  color: #a24f00;
  font-size: 12px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

/* Reviewer notu — listenin ÜSTÜNDE, BİR KEZ. */
.cc-revizyon-hero-not {
  display: flex;
  gap: 10px;
  max-width: 560px;
  margin: 0 0 18px;
  padding: 12px 14px;
  border: 1px solid #f0dfc9;
  border-left: 3px solid var(--cc-action-text);
  border-radius: 10px;
  background: #fffaf3;
  color: #5c4a35;
  font-size: 14px;
  line-height: 1.5;
}

.cc-revizyon-hero-not i {
  margin-top: 2px;
  color: var(--cc-action-text);
}

.cc-revizyon-hero-not p {
  margin: 0;
}

.cc-revizyon-hero-not p + p {
  margin-top: 8px;
}

/* Kalem listesi — etiket + durum ikonu. Reviewer notu BURADA TEKRARLANMAZ
   (§14.44: not check seviyesinde, üstte bir kez). */
.cc-revizyon-hero-liste {
  max-width: 560px;
  margin: 0 0 22px;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
}

.cc-revizyon-hero-kalem {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 12px;
  border: 1px solid #ffd5a0;
  border-radius: 999px;
  background: #fff5e8;
  color: #8a5200;
  font-size: 13px;
  font-weight: 600;
  /* ⚠️ KEHRİBAR, KIRMIZI DEĞİL (§11.2): ortada bir HATA yok, kullanıcının
     yapacağı bir İŞ var. Kırmızı yalnız REJECTED içindir. */
}

.cc-revizyon-hero-kalem i {
  color: var(--cc-action-text);
}

/* ⛔ `.cc-revizyon-hero-kalem.is-duzeltildi` (yeşil chip) KALDIRILDI
   2026-09-17: hero listesi artık yalnız BEKLEYENLERİ basıyor, düzeltilen
   kalem hiç render edilmiyor ve kural ölü kalıyordu.

   ⚠️ ŞERİDİN KARDEŞ KURALI DURUYOR (`cc_verify_action.css`
   `.cc-revizyon-kalem.is-duzeltildi`) — o yüzey düzeltilen kalemi hâlâ
   basıyor; filtre yalnız hero'ya uygulandı (gerekçe partial'da yazılı).
   İki dosya birden temizlenseydi şeritteki chip'ler renksiz inerdi. */

/* Düğmeler hero'nun ALTINDA — rol mantığı `_verification_action.html`te,
   burada yalnız yerleşim. */
.cc-revizyon-hero-eylem {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding-bottom: 4px;
}

/* ⛔ DAR VARYANT — ayarlar sayfası. İllüstrasyon partial tarafından hiç
   basılmıyor; burada içerik sütunu tam genişliğe açılıyor. İkinci bir
   markup YAZILMADI (§16.1). */
.cc-review-hero--dar .cc-review-hero-content {
  width: 100%;
  max-width: none;
}

.cc-review-hero--dar {
  min-height: auto;
  padding: 26px 24px 6px;
}