/* ========================
   Tarantin2 Presentation
   External Stylesheet (v1)
   Built fresh by M2House | Ronnie
   ======================== */

:root {
  --t2-bg: #0d0b0a;
  --t2-panel: #151210;
  --t2-ink: #efe7dd;
  --t2-muted: #c8bba7;
  --t2-acc: #c89b3c;   /* altın */
  --t2-acc-2: #7e6130; /* koyu altın */
  --t2-red1: #9b0000;
  --t2-red2: #2c0000;
  --t2-glass: rgba(12,10,9,0.45);
  --t2-shadow: 0 10px 30px rgba(0,0,0,.35);
  --radius: 14px;
  --radius-lg: 22px;
  --container: 1100px;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0; background: var(--t2-bg); color: var(--t2-ink);
  font-family: 'Quicksand', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  line-height: 1.6; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}

/* Background video + overlay */
.t2-hero-wrap { position: relative; min-height: 72vh; display: grid; place-items: center; overflow: hidden; }
.t2-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.t2-overlay { position: absolute; inset: 0; background: radial-gradient(1200px 600px at 50% 20%, rgba(0,0,0,.35), rgba(0,0,0,.75)), linear-gradient(to bottom, rgba(0,0,0,.3), rgba(0,0,0,.85)); }

.t2-hero { position: relative; z-index: 2; max-width: var(--container); width: 100%; padding: 72px 20px 56px; text-align: center; }
.t2-brand { width: clamp(240px, 60vw, 720px); margin-inline: auto; display: block; filter: drop-shadow(0 10px 20px rgba(0,0,0,.55)); }
.t2-kicker { display:inline-block; margin: 18px 0 8px; padding: 6px 12px; border-radius: 999px; font-weight:600; letter-spacing:.4px; background: rgba(0,0,0,.35); color: #ffe5b0; border: 1px solid rgba(255,210,114,.25); backdrop-filter: blur(6px); }
.t2-title { font-family: 'Cinzel', serif; letter-spacing: 1px; font-size: clamp(30px, 4.6vw, 48px); margin: 18px 0 6px; text-shadow: 0 2px 0 rgba(0,0,0,.35); }
.t2-sub { font-weight:600; color: #ffe5c6; max-width: 900px; margin: 0 auto 22px; }

.t2-actions { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; margin-top: 10px; }
.t2-btn { --pad:12px 16px; display:inline-flex; align-items:center; gap:10px; padding:var(--pad); border-radius: 999px; border:1px solid rgba(255,255,255,.15); background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); color:#fff; text-decoration:none; box-shadow: var(--t2-shadow); transition: transform .15s ease, border-color .15s ease, background .15s ease; }
.t2-btn:hover { transform: translateY(-2px); border-color: rgba(200,155,60,.6); }
.t2-btn--ghost { background: rgba(0,0,0,.35); }
.t2-btn--primary { background: linear-gradient(180deg, #cfa24a, #8f6a2a); border-color: #c89b3c; color:#0f0c08; font-weight:700; }

/* Sections */
.t2-main { position: relative; z-index: 3; }
.t2-section { padding: 64px 20px; }
.t2-section + .t2-section { border-top: 1px solid rgba(255,255,255,.06); }
.t2-section__inner { max-width: var(--container); margin: 0 auto; display:grid; grid-template-columns: repeat(12, 1fr); gap: 24px; align-items: start; }
.t2-section__title { grid-column: 1/-1; font-family: 'Cinzel', serif; font-size: clamp(24px, 3.6vw, 36px); margin: 0 0 6px; color: #ffe0a2; }
.t2-col { grid-column: span 7; }
.t2-col--img { grid-column: span 5; }

@media (max-width: 900px) {
  .t2-col, .t2-col--img { grid-column: 1/-1; }
}

.t2-card { background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015)); border:1px solid rgba(255,255,255,.07); border-radius: var(--radius-lg); padding: 20px 22px; box-shadow: var(--t2-shadow); }
.t2-em { color:#ffd789; font-weight:700; }
.t2-highlight { background: rgba(200,155,60,.12); border:1px dashed rgba(200,155,60,.55); color:#ffe7b8; border-radius: var(--radius); padding: 10px 12px; display:inline-block; }

.t2-figure { position: relative; border-radius: var(--radius-lg); overflow: hidden; border:1px solid rgba(255,255,255,.08); box-shadow: var(--t2-shadow); }
.t2-figure img { width: 100%; height: auto; display:block; }
.t2-figure .t2-zoom { position:absolute; inset:auto 10px 10px auto; background: rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.25); border-radius: 10px; padding: 6px 10px; font-size: 12px; color:#fff; }

/* === Features grid (3-up on desktop) === */
.t2-section__inner > .t2-feature-grid,
.t2-section__inner > p { grid-column: 1 / -1; }
.t2-feature-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; align-items: stretch; }
@media (max-width: 1024px) { .t2-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .t2-feature-grid { grid-template-columns: 1fr; } }

.t2-feature-card { position: relative; padding: 18px 18px 16px; border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
  border: 1px solid rgba(255,255,255,.08); box-shadow: var(--t2-shadow);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; overflow: hidden;
  display:flex; flex-direction: column; }
.t2-feature-card::before { content:""; position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(600px 200px at -10% -10%, rgba(255,255,255,.06), transparent 60%),
              radial-gradient(600px 200px at 110% 110%, rgba(255,255,255,.04), transparent 60%);
  opacity: .8; }
.t2-feature-card::after { content:""; position:absolute; inset:0 0 auto 0; height:3px; background:
  linear-gradient(90deg, color-mix(in srgb, var(--acc, var(--t2-acc)) 70%, #fff 15%), transparent 45%, transparent 55%, color-mix(in srgb, var(--acc, var(--t2-acc)) 70%, #000 15%)); }
.t2-feature-card:hover { transform: translateY(-6px); border-color: color-mix(in srgb, var(--acc, var(--t2-acc)) 70%, #fff 15%); box-shadow: 0 16px 40px rgba(0,0,0,.45); }

.t2-feature-head { display:flex; align-items:center; gap:12px; margin-bottom: 10px; }
.t2-feature-icon { width: 44px; height: 44px; display:grid; place-items:center; border-radius: 12px;
  background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.18); box-shadow: 0 6px 16px rgba(0,0,0,.25); }
.t2-feature-icon i { font-size: 20px; color: color-mix(in srgb, var(--acc, var(--t2-acc)) 82%, #fff 8%); }

.t2-feature-title { margin: 0; font-size: 18px; letter-spacing: .3px; color:#ffe3a6; font-weight: 700; }
.t2-feature-desc { margin: 6px 0 0; color: var(--t2-muted); }

.t2-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top: 12px; }
.t2-tag { font-size: 12px; padding: 4px 8px; border-radius: 999px; background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12); color:#ffe7c0; letter-spacing: .2px; }

/* Footer */
.t2-footer { padding: 32px 20px 60px; text-align:center; border-top: 1px solid rgba(255,255,255,.06); }
.t2-footer p { margin: 8px 0; color: #e0c9a6; }
.t2-footer a { color: #d8b979; text-decoration: none; }
.t2-social { margin-top: 12px; display:flex; gap: 16px; justify-content:center; }
.t2-social a { width: 44px; height: 44px; display:grid; place-items:center; border-radius: 50%; color:#fff; box-shadow: 0 2px 12px #0002; transition: transform .18s ease; }
.t2-social a:hover { transform: scale(1.12); }
.t2-social a svg { width: 24px; height: 24px; }
.t2-social .is-discord { background:#5865F2; box-shadow: 0 2px 12px #5865F2a0; }
.t2-social .is-instagram { background: radial-gradient(circle at 30% 110%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); box-shadow: 0 2px 12px #d6249fa0; }
.t2-social .is-tiktok { background:#000; box-shadow: 0 2px 12px #000a; }

/* Discord floating widget */
.t2-discord-fab { position: fixed; right: 18px; bottom: 18px; z-index: 50; display:block; width: 72px; height: 72px; border-radius: 22px; overflow:hidden; box-shadow: 0 12px 28px rgba(0,0,0,.45); transform: translateZ(0); }
.t2-discord-fab img { width: 100%; height: 100%; display:block; }

/* Glass subtitle */
.t2-glass-note { position: relative; z-index:2; text-align:center; margin: 8px 0 0; }
.t2-glass-note span { display:inline-block; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.15); padding: 6px 12px; border-radius: 999px; backdrop-filter: blur(6px); color:#ffe7b8; }

/* Utility */
.u-m0 { margin:0 !important; }
.u-mt12 { margin-top:12px !important; }
.u-mt20 { margin-top:20px !important; }
.u-center { text-align:center !important; }
.u-list { padding-left: 18px; }

/* Simple lightbox */
.lb-wrap { position: fixed; inset:0; display:none; align-items:center; justify-content:center; background: rgba(0,0,0,.85); z-index: 100; }
.lb-wrap.is-open { display:flex; }
.lb-img { max-width: 92vw; max-height: 86vh; border-radius: 12px; border:1px solid rgba(255,255,255,.2); box-shadow: 0 20px 60px rgba(0,0,0,.6); }
.lb-controls { position: absolute; inset:auto 0 20px 0; display:flex; justify-content:center; gap: 10px; }
.lb-btn { background: rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.25); color:#fff; border-radius: 999px; padding: 8px 12px; cursor:pointer; }

/* Countdown (launch timer) */
.t2-countdown { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; margin-top:22px; }
.t2-countseg { background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius: 14px; padding: 10px 14px; min-width: 90px; text-align:center; box-shadow: var(--t2-shadow); }
.t2-num { display:block; font-family: 'Cinzel', serif; font-size: clamp(28px, 6vw, 46px); line-height:1; color:#ffe3a6; letter-spacing:1px; }
.t2-label { display:block; font-size:12px; color: var(--t2-muted); margin-top:5px; letter-spacing:.5px; text-transform: uppercase; }
.t2-sep { font-family: 'Cinzel', serif; font-size: clamp(24px,5vw,40px); color:#d7a84f; margin:0 4px; }
.t2-cta { width:100%; text-align:center; margin-top:8px; }

/* Anti-copy & DevTools overlay */
body.protect p,
body.protect h1,
body.protect h2,
body.protect h3,
body.protect h4,
body.protect h5,
body.protect h6,
body.protect .t2-card,
body.protect .t2-feature-card { user-select: none; -webkit-user-select: none; }
img, video { -webkit-user-drag: none; }

.devtools-overlay { position: fixed; inset:0; background: rgba(0,0,0,.9); color:#fff; display:none; align-items:center; justify-content:center; z-index: 9999; }
.devtools-overlay .box { padding: 24px; border:1px solid rgba(255,255,255,.1); border-radius: 12px; background: rgba(255,255,255,.04); }
body.is-locked #main,
body.is-locked .t2-hero { filter: blur(6px) saturate(.2); pointer-events: none; }
body.is-locked .devtools-overlay { display:flex; }