/* =============================================================
 * internship/theme.css — NEOBRUTALIST tasarım sistemi
 * Tasarım: INTERNSHIP.PHEXUM.COM (617:1930). Token'lar variable defs'ten (652:552).
 * ============================================================= */

/* ---- Fontlar (self-host) ---- */
@font-face { font-family: 'Space Grotesk'; font-weight: 500; font-style: normal; font-display: swap;
  src: url('/internship-theme/assets/fonts/spacegrotesk-500.woff2') format('woff2'); }
@font-face { font-family: 'Space Grotesk'; font-weight: 600; font-style: normal; font-display: swap;
  src: url('/internship-theme/assets/fonts/spacegrotesk-600.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 300; font-style: normal; font-display: swap;
  src: url('/internship-theme/assets/fonts/manrope-300.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('/internship-theme/assets/fonts/manrope-400.woff2') format('woff2'); }
@font-face { font-family: 'Manrope'; font-weight: 500; font-style: normal; font-display: swap;
  src: url('/internship-theme/assets/fonts/manrope-500.woff2') format('woff2'); }

/* ---- Token'lar ---- */
:root {
  /* Yüzeyler */
  --in-bg: #FAF7F2;          /* Zemin */
  --in-card: #FFFFFF;        /* Kart */
  --in-card-accent: #F8F3E6; /* Kart Vurgu */
  --in-card-fill: #FAF7EF;   /* Kart Dolgu */
  /* Çizgi/siyah */
  --in-border: #0A0A0A;      /* Kenarlık (kalın) */
  --in-black: #000000;
  /* Aksan renkleri */
  --in-orange: #FF6B35;      /* Turuncu 500 */
  --in-lime: #D4F547;        /* Lime 500 */
  --in-yellow: #F2D602;      /* Sarı 500 */
  --in-lime-900: #133907;
  /* Metin */
  --in-heading: #0A0A0A;     /* Metin/Başlık */
  --in-body: #3A3A3A;        /* Metin/Gövde */
  --in-muted: #8A8A85;       /* Metin/Açıklama */
  /* Proje etiketleri */
  --in-tag-open-bg: #D4F547;
  --in-tag-full-bg: #3A3A3A;
  --in-tag-waitlist-bg: #FF6B35;
  --in-tag-text-white: #FFFFFF;
  /* Fontlar */
  --in-head: 'Space Grotesk', system-ui, sans-serif;
  --in-text: 'Manrope', system-ui, sans-serif;
  /* Neobrutalist gölge (offset, blur YOK) */
  --in-shadow: 4px 4px 0 0 var(--in-black);
  --in-shadow-sm: 2px 2px 0 0 var(--in-black);
  --in-shadow-lg: 6px 6px 0 0 var(--in-black);
}

/* ---- Reset / temel ---- */
* { box-sizing: border-box; }
.in-body {
  margin: 0; background: var(--in-bg); color: var(--in-body);
  font-family: var(--in-text); font-weight: 400; font-size: 16px; line-height: 28px;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
.in-body img { max-width: 100%; display: block; }
.in-body a { color: inherit; text-decoration: none; }
/* Metin seçimi (fare ile) — lime zemin + siyah metin (tasarım dili) */
.in-body ::selection { background: var(--in-lime); color: var(--in-heading); }
.in-body ::-moz-selection { background: var(--in-lime); color: var(--in-heading); }

/* =============================================================
 * NEOBRUTALIST ÖZEL İMLEÇ — yalnız fare (pointer:fine) cihazlarda.
 * dot: lime kare (birebir takip) · ring: siyah çerçeve kare (yumuşak takip),
 * link/buton üzerinde büyür+turuncu, tıklamada küçülür.
 * ============================================================= */
.in-cursor { display: none; }
@media (hover: hover) and (pointer: fine) {
  html.in-has-cursor, html.in-has-cursor * { cursor: none !important; }
  /* Metin girişi alanlarında native metin imleci (I-beam) göster — kullanıcı
     yazarken caret'i görsün. Özel lime imleç bu alanların üzerinde gizlenir (JS). */
  html.in-has-cursor input[type="text"], html.in-has-cursor input[type="email"],
  html.in-has-cursor input[type="url"], html.in-has-cursor input[type="tel"],
  html.in-has-cursor input[type="search"], html.in-has-cursor input[type="number"],
  html.in-has-cursor input[type="password"], html.in-has-cursor input:not([type]),
  html.in-has-cursor textarea { cursor: text !important; }
  html.in-has-cursor.in-cursor-hide-native .in-cursor { opacity: 0; }
  .in-cursor { position: fixed; left: 0; top: 0; z-index: 9999; pointer-events: none; display: block; }
  .in-cursor__dot, .in-cursor__ring { position: fixed; left: 0; top: 0; display: block;
    transform: translate3d(var(--x,-100px), var(--y,-100px), 0) translate(-50%,-50%); }
  /* dot: 12px lime kare, 2px siyah border, sert gölge — anında takip */
  .in-cursor__dot { width: 12px; height: 12px; background: var(--in-lime);
    border: 2px solid var(--in-border); box-shadow: 2px 2px 0 0 var(--in-black); }
  /* ring: 36px çerçeve kare — gecikmeli takip (JS lerp), yumuşak boyut/renk geçişi */
  .in-cursor__ring { width: 36px; height: 36px; background: transparent;
    border: 2px solid var(--in-border);
    transition: width .16s ease, height .16s ease, background-color .16s ease, border-color .16s ease, opacity .16s ease; }
  /* İnteraktif öğe üzerinde: ring büyür + turuncu dolgu (hafif), dot gizlenir gibi büyür */
  .in-cursor.is-hot .in-cursor__ring { width: 52px; height: 52px; border-color: var(--in-orange); background: rgba(255,107,53,0.12); }
  .in-cursor.is-hot .in-cursor__dot { background: var(--in-orange); }
  /* Tıklama: ring küçülür (basıldı hissi) */
  .in-cursor.is-down .in-cursor__ring { width: 26px; height: 26px; }
  .in-cursor.is-down .in-cursor__dot { transform: translate3d(var(--x,-100px), var(--y,-100px), 0) translate(-50%,-50%) scale(.7); }
  /* Ekran dışında gizle */
  .in-cursor.is-hidden { opacity: 0; }
}

/* İçerik kolonu (1280 frame; içerik ~827px, iki yanda ~228 boşluk).
   İçerik SÜTUNU ortalanır: her iki inset = (viewport-827)/2, 228'de sınırlı, minimum 24.
   Böylece 1000–1280 arasında da denge korunur (sol-ağır boşluk olmaz), 1280'de ~228 inset. */
.in-container {
  width: 1283px; max-width: 100%; margin-inline: auto;
  padding-inline: clamp(24px, calc((100vw - 827px) / 2), 228px);
}
/* Tek kırılım: 1000px altında tüm sayfa akışkan/dikey moda geçer, sol inset 24px'e iner. */
@media (max-width: 1000px) {
  .in-container { padding-inline: 24px; }
}

/* ---- Tipografi yardımcıları (tasarım başlık/gövde ölçüleri) ---- */
.in-h3 { font-family: var(--in-head); font-weight: 500; font-size: 32px; line-height: 40px; letter-spacing: -1px; color: var(--in-heading); }
.in-h4 { font-family: var(--in-head); font-weight: 500; font-size: 24px; line-height: 32px; letter-spacing: -0.5px; color: var(--in-heading); }
.in-h5 { font-family: var(--in-head); font-weight: 500; font-size: 20px; line-height: 28px; letter-spacing: -0.5px; color: var(--in-heading); }
.in-h6 { font-family: var(--in-head); font-weight: 500; font-size: 16px; line-height: 28px; letter-spacing: -0.5px; color: var(--in-heading); }
.in-lg { font-size: 18px; line-height: 30px; }
.in-sm { font-size: 14px; line-height: 22px; }
.in-desc { font-size: 12px; line-height: 18px; font-weight: 500; }

/* ---- Neobrutalist yardımcılar ---- */
.in-box { border: 2px solid var(--in-border); background: var(--in-card); }
.in-shadow { box-shadow: var(--in-shadow); }

/* ---- Buton (bg beyaz + siyah border + metin #0A0A0A; hover bg turuncu + metin beyaz) ---- */
.in-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: var(--in-head); font-weight: 500; font-size: 16px; line-height: 28px;
  background: var(--in-card); color: var(--in-heading);
  border: 2px solid var(--in-border); box-shadow: var(--in-shadow);
  padding: 12px 24px; cursor: pointer;
  transition: background 0.12s linear, color 0.12s linear, transform 0.08s linear, box-shadow 0.08s linear;
}
.in-btn:hover { background: var(--in-orange); color: #fff; }
.in-btn:active { transform: translate(2px,2px); box-shadow: var(--in-shadow-sm); }
.in-btn--orange { background: var(--in-orange); color: #fff; }
.in-btn--orange:hover { background: var(--in-heading); }
