/* =========================================================================
   variant-a.css — Varyant A "Defter" (DAĞINIK SCRAPBOOK MASASI)
   En sıcak, en "el yapımı dağınık masa". Asimetrik/eğik yerleşim; öğeler döner,
   üst üste biner; washi farklı yönlerde; iliştirilmiş el yazısı not, kurutulmuş
   çiçek köşeleri, klips. Izgara bilinçli kırılır. (tasarim-sistemi §2 · A)
   > Okunaklılık: metin blokları çok az döner, gövde Lora — net kalır.
   ========================================================================= */

body[data-variant="a"] {
  --c-paper-line:   rgba(122,29,47,.06);   /* kareli görünür ama silik (okunaklılık) */
  --grid-size:      24px;
  --tilt:           3deg;
  --motif-strength: 1;
  --space-section:  4.8rem;
  --c-bg:           #F4EAD6;                /* sıcak/sarımsı defter kağıdı */
  background-color: var(--c-bg);
}

/* Defter sol marj çizgisi (silik) */
body[data-variant="a"]::after {
  content: ""; position: fixed; top: 0; bottom: 0; left: 38px; width: 2px;
  background: rgba(200,36,62,.10); pointer-events: none; z-index: 0;
}
@media (max-width: 991.98px) { body[data-variant="a"]::after { display: none; } }

/* A'da kozmik/yıldız katmanı yok — bu bir gündüz masası */
body[data-variant="a"] .hero-cosmos, body[data-variant="a"] .hero-stardust { display: none; }

/* Muhabbet kuşu imleç (kuyruk/gaga tıklama noktası) */
body[data-variant="a"] :is(a, .btn, button, [role="button"], summary, label[for], .navbar-toggler) {
  cursor:
    url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='30'%20height='30'%20viewBox='0%200%2030%2030'%3E%3Cpath%20d='M9%2026%20q-3-1-3-5%20q0-8%208-10%20q7-1.5%2012%203%20q4%203.5%203%208%20q-1%204-5%205z'%20fill='%231A1A1A'/%3E%3Cpath%20d='M22%2017%20q6-3%208%200%20q-3%203-8%202z'%20fill='%231A1A1A'/%3E%3Ccircle%20cx='13'%20cy='13'%20r='1.3'%20fill='%23F4D03F'/%3E%3Cpath%20d='M9%2014%20q-3.5%200-4.5%202%20q2.5%201.5%205%200z'%20fill='%23C8243E'/%3E%3C/svg%3E") 6 4,
    pointer;
}

/* ---- HERO: dağınık masa ---- */
body[data-variant="a"] .hero { padding-top: 3.4rem; }
/* metin bloğu yırtık kağıt üstünde, hafif eğik, bantlı */
body[data-variant="a"] .hero-copy {
  position: relative; transform: rotate(-1.1deg);
  background: #FFFBEF; border-radius: 3px;
  padding: 1.6rem 1.6rem 1.8rem;
  box-shadow: 0 10px 26px rgba(26,26,26,.10);
}
/* Masaüstünde KESİN iki sütun: metin solda, polaroid sağda (alt satıra kaymaz).
   col-lg-6 alt-lg'de genişlik vermediği için burada açıkça veriyoruz. */
@media (min-width: 768px) {
  body[data-variant="a"] .hero .row { flex-wrap: nowrap; align-items: flex-start; }
  body[data-variant="a"] .hero .col-lg-6.hero-copy { flex: 0 0 54%; max-width: 54%; }
  body[data-variant="a"] .hero .col-lg-6:not(.hero-copy) { flex: 0 0 46%; max-width: 46%; }
}
body[data-variant="a"] .hero-copy::before {   /* üstte washi bant */
  content: ""; position: absolute; top: -14px; left: 30px; width: 110px; height: 28px;
  background: rgba(244,208,63,.6); transform: rotate(-5deg);
  box-shadow: 0 1px 4px rgba(26,26,26,.12);
}
body[data-variant="a"] .polaroid-hero { transform: rotate(4deg); }
body[data-variant="a"] .polaroid-hero::after {  /* ikinci bant, farklı yön */
  content: ""; position: absolute; bottom: 18px; right: -10px; width: 80px; height: 24px;
  background: rgba(200,181,217,.6); transform: rotate(8deg);
}

/* desk-extras: çiçek köşeleri + klips + iliştirilmiş not (yalnız A) */
body[data-variant="a"] .desk-extras { display: block; position: absolute; inset: 0; pointer-events: none; z-index: 1; }
body[data-variant="a"] .de-flower1 { position: absolute; top: 4%; right: 8%; width: 54px; height: 80px; color: var(--c-mystic); transform: rotate(12deg); }
body[data-variant="a"] .de-flower2 { position: absolute; bottom: 2%; left: 4%; width: 60px; height: 88px; color: var(--c-heading); opacity: .8; transform: rotate(-18deg); }
body[data-variant="a"] .de-clip {
  position: absolute; top: 8%; left: 46%; width: 16px; height: 40px;
  border: 3px solid #9a8f80; border-radius: 8px; transform: rotate(24deg);
}
body[data-variant="a"] .de-note {
  position: absolute; top: 60%; left: 2%; transform: rotate(-7deg);
  background: rgba(244,208,63,.85); color: var(--c-heading);
  padding: .4rem .8rem; border-radius: 2px; font-size: 1.5rem;
  box-shadow: 0 4px 12px rgba(26,26,26,.14);
}
@media (max-width: 991.98px) { body[data-variant="a"] .desk-extras { display: none; } }

/* ---- Bölüm etiketleri: el yazısı, eğik washi (sıcak/kişisel) ---- */
body[data-variant="a"] .section-tag.washi-label {
  transform: rotate(-2.4deg); background: rgba(244,208,63,.5);
  font-family: var(--font-accent); font-size: 1.2rem; letter-spacing: .02em; text-transform: none;
}
body[data-variant="a"] .section-head .section-title::after {
  content: ""; display: block; width: 76px; height: 6px; margin: .5rem auto 0;
  background: var(--c-highlight); border-radius: 40% 60% 50% 50% / 100% 100% 0 0;
  transform: skewX(-12deg); opacity: .8;
}

/* ---- Eğitim kartları: SAÇILMIŞ fotoğraflar (eğik + kaydırmalı + bantlı) ---- */
body[data-variant="a"] .courses-grid > [class*="col-"] { display: flex; }
body[data-variant="a"] .course-card { position: relative; }
body[data-variant="a"] .course-card::before {   /* her kartın tepesinde washi bant */
  content: ""; position: absolute; top: -12px; left: 50%; width: 78px; height: 24px;
  background: rgba(200,181,217,.65); transform: translateX(-50%) rotate(-4deg);
  z-index: 4; box-shadow: 0 1px 4px rgba(26,26,26,.12);
}
body[data-variant="a"] .courses-grid > div:nth-child(1) .course-card { transform: rotate(-3deg); }
body[data-variant="a"] .courses-grid > div:nth-child(2) .course-card { transform: rotate(2.5deg); margin-top: 1.8rem; }
body[data-variant="a"] .courses-grid > div:nth-child(3) .course-card { transform: rotate(-1.8deg); margin-top: -.6rem; }
body[data-variant="a"] .courses-grid > div:nth-child(4) .course-card { transform: rotate(3.4deg); margin-top: 2.6rem; }
body[data-variant="a"] .course-card:hover { transform: rotate(0) translateY(-6px) scale(1.02); z-index: 6; }
body[data-variant="a"] .course-card::before { } /* tape stays */

/* ---- Yorumlar: eğik, bantlı yapışkan notlar ---- */
body[data-variant="a"] .review-card {
  border-top: none; box-shadow: 0 8px 20px rgba(26,26,26,.12);
}
body[data-variant="a"] .reviews-grid > div:nth-child(odd)  .review-card { transform: rotate(-2deg); background: #FFFBEF; }
body[data-variant="a"] .reviews-grid > div:nth-child(even) .review-card { transform: rotate(1.6deg); background: #fdf3ea; }
body[data-variant="a"] .review-card:hover { transform: rotate(0) translateY(-4px); }

/* Kartlarda sararmış kağıt */
body[data-variant="a"] .note-card, body[data-variant="a"] .consult-card, body[data-variant="a"] .lineage { background: #FFFBEF; }
body[data-variant="a"] .note-card:nth-child(n) { }
body[data-variant="a"] .blog-grid > div:nth-child(1) .note-card { transform: rotate(-1.5deg); }
body[data-variant="a"] .blog-grid > div:nth-child(2) .note-card { transform: rotate(1.2deg); margin-top: 1rem; }
body[data-variant="a"] .blog-grid > div:nth-child(3) .note-card { transform: rotate(-.8deg); }

/* Dekoratif bant/pseudo öğeler tıklamayı engellemesin */
body[data-variant="a"] .hero-copy::before,
body[data-variant="a"] .polaroid-hero::after,
body[data-variant="a"] .course-card::before { pointer-events: none; }
