/* IKO Diaspora Tribune — Bootstrap 5 theme */
:root {
  --bg: #0b0b0d;
  --bg-soft: #131318;
  --card: #16161c;
  --border: rgba(255, 255, 255, 0.08);
  --text: #f3f1ec;
  --muted: #9c9a93;
  --gold-1: #d4a23c;
  --gold-2: #f3d27a;
  --gold-3: #b8841f;
  --gradient-gold: linear-gradient(135deg, #b8841f 0%, #f3d27a 50%, #d4a23c 100%);
  --gradient-hero: linear-gradient(180deg, rgba(11,11,13,.2) 0%, rgba(11,11,13,.6) 60%, rgba(11,11,13,.95) 100%);
  --shadow-gold: 0 10px 30px -10px rgba(212, 162, 60, 0.45);
}

html, body { background: var(--bg); color: var(--text); }
body { font-family: 'Inter', system-ui, -apple-system, sans-serif; font-weight: 400; }

h1, h2, h3, h4, .font-display { font-family: 'Playfair Display', Georgia, serif; font-weight: 700; letter-spacing: -0.01em; }
.text-muted-2 { color: var(--muted) !important; }
.eyebrow { display: inline-block; font-size: .72rem; letter-spacing: .28em; text-transform: uppercase; color: var(--gold-1); padding: .35rem 1rem; border: 1px solid rgba(212,162,60,.4); border-radius: 999px; background: rgba(212,162,60,.06); }
.text-gradient-gold { background: var(--gradient-gold); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* Navbar */
.navbar-iko { backdrop-filter: blur(18px); background: rgba(11,11,13,.7); border-bottom: 1px solid var(--border); }
.navbar-iko .nav-link { color: rgba(243,241,236,.8); font-weight: 500; font-size: .92rem; }
.navbar-iko .nav-link:hover { color: var(--gold-1); }
.brand-stack { line-height: 1; }
.brand-stack .brand-1 { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 1.1rem; letter-spacing: .04em; }
.brand-stack .brand-2 { font-size: .62rem; letter-spacing: .3em; color: var(--muted); margin-top: 2px; }

/* Buttons */
.btn-gold { background: var(--gradient-gold); color: #1a1408; border: none; font-weight: 600; border-radius: 999px; padding: .65rem 1.4rem; box-shadow: var(--shadow-gold); }
.btn-gold:hover { color: #1a1408; opacity: .95; }
.btn-outline-iko { color: var(--text); border: 1px solid var(--border); border-radius: 999px; padding: .55rem 1.2rem; background: transparent; }
.btn-outline-iko:hover { border-color: var(--gold-1); color: var(--gold-1); }

/* Hero */

.hero .hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.05); }
.hero .hero-overlay { position: absolute; inset: 0; background: var(--gradient-hero); }
.hero h1 { font-size: clamp(2.8rem, 6vw, 5.5rem); line-height: 1; }
.hero .lead { color: rgba(243,241,236,.85); font-size: 1.05rem; }
.hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding-top: 90px;
}

.hero .hero-inner {
  position: relative;
  padding: 0 1.5rem 2rem;
  width: 100%;
}

/* Sections */
section.iko { padding: 7rem 0; }
section.iko.soft { background: rgba(22,22,28,.5); }
section.iko h2 { font-size: clamp(2rem, 4vw, 3.4rem); line-height: 1.05; }

/* Cards */
.card-iko { background: var(--card); border: 1px solid var(--border); border-radius: 1.2rem; padding: 2rem; height: 100%; transition: transform .3s ease, border-color .3s ease; }
.card-iko:hover { transform: translateY(-4px); border-color: rgba(212,162,60,.4); }
.card-iko h3 { font-size: 1.35rem; }
.card-iko .icon-pill { width: 44px; height: 44px; border-radius: 12px; background: rgba(212,162,60,.12); color: var(--gold-1); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 1.1rem; }

.rubrique-tag { font-size: .68rem; letter-spacing: .25em; color: var(--gold-1); text-transform: uppercase; }
.pill-link { display: inline-flex; align-items: center; gap: .5rem; padding: .6rem 1.1rem; border-radius: 999px; border: 1px solid var(--border); color: var(--text); font-size: .88rem; text-decoration: none; transition: all .2s; }
.pill-link:hover { border-color: var(--gold-1); color: var(--gold-1); }

/* Journal cover */
.journal-cover-wrap { position: relative; }
.journal-cover-wrap img { width: 100%; border-radius: 1rem; box-shadow: 0 30px 60px -20px rgba(0,0,0,.7); }

/* Pricing */
.price-card { background: var(--card); border: 1px solid var(--border); border-radius: 1.2rem; padding: 2rem; height: 100%; }
.price-card.featured { border-color: var(--gold-1); box-shadow: var(--shadow-gold); }
.price-card .price { font-family: 'Playfair Display', serif; font-size: 2.6rem; font-weight: 700; }
.price-card ul { list-style: none; padding: 0; margin: 1.5rem 0 0; }
.price-card li { padding: .45rem 0; border-bottom: 1px dashed var(--border); color: rgba(243,241,236,.85); }
.price-card li::before { content: "✓ "; color: var(--gold-1); margin-right: .35rem; }

/* Land listings */
.land-card img { width: 100%; height: 200px; object-fit: cover; border-top-left-radius: 1rem; border-top-right-radius: 1rem; background: #222; }
.land-card { background: var(--card); border: 1px solid var(--border); border-radius: 1rem; overflow: hidden; height: 100%; display: flex; flex-direction: column; }
.land-card .body { padding: 1.25rem; flex: 1; display: flex; flex-direction: column; }
.land-card h4 { font-size: 1.1rem; }
.land-card .price-tag { color: var(--gold-1); font-weight: 700; font-size: 1.15rem; }
.badge-iko { background: rgba(212,162,60,.15); color: var(--gold-2); border: 1px solid rgba(212,162,60,.35); font-weight: 500; }

/* Footer */
footer.iko { background: rgba(22,22,28,.6); border-top: 1px solid var(--border); padding: 4rem 0 2rem; }
footer.iko h4 { font-size: .95rem; color: var(--gold-1); letter-spacing: .12em; text-transform: uppercase; }
footer.iko a { color: rgba(243,241,236,.75); text-decoration: none; }
footer.iko a:hover { color: var(--gold-1); }
footer.iko ul { list-style: none; padding: 0; }
footer.iko li { padding: .3rem 0; font-size: .92rem; }
footer.iko .legal { border-top: 1px solid var(--border); margin-top: 3rem; padding-top: 1.5rem; font-size: .85rem; color: var(--muted); }

/* Auth page */
.auth-card { max-width: 460px; margin: 8rem auto; background: var(--card); border: 1px solid var(--border); border-radius: 1.2rem; padding: 2.5rem; }
.auth-card .form-control { background: var(--bg-soft); border: 1px solid var(--border); color: var(--text); }
.auth-card .form-control:focus { border-color: var(--gold-1); box-shadow: 0 0 0 .15rem rgba(212,162,60,.2); background: var(--bg-soft); color: var(--text); }
.auth-card label { color: var(--muted); font-size: .85rem; letter-spacing: .05em; text-transform: uppercase; }

/* Animations */
@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.fade-up { animation: fadeUp .8s ease both; }