/* ═══════════════════════════════════════════════════════
   INSTITUTO LORDE — SKIN: instagram
═══════════════════════════════════════════════════════ */

/* ── page background ── */
body {
  background: var(--navy-deep);
}

/* ── page-hero ── */
.page-hero {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(201,168,76,0.10) 0%, transparent 60%),
    linear-gradient(160deg, var(--navy-deep) 0%, var(--navy) 45%, var(--navy-mid) 80%, #162036 100%);
}
.page-hero::before {
  background: linear-gradient(90deg,transparent,var(--gold),var(--gold-light),var(--gold),transparent);
}
.page-hero h1       { color: #fff; }
.page-hero h1 em    { color: var(--gold-light); }
.page-hero p        { color: rgba(255,255,255,0.60); }

/* ── instagram-feed ── */
.ig-section {
  background: linear-gradient(180deg, var(--navy-dark) 0%, var(--navy) 100%);
}

.ig-title {
  background: linear-gradient(135deg, var(--gold), var(--gold-bright));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.ig-subtitle { color: rgba(255,255,255,0.55); }

.ig-line {
  background: linear-gradient(90deg, var(--gold), var(--gold-light), transparent);
}

.ig-post {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(201,168,76,0.14);
  box-shadow: 0 8px 32px rgba(0,0,0,0.30);
}

.ig-post:hover {
  border-color: rgba(201,168,76,0.30);
  box-shadow: 0 16px 48px rgba(0,0,0,0.45), 0 0 0 1px rgba(201,168,76,0.20);
}

/* ── Paginação ── */
.ig-page-btn {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.55);
}
.ig-page-btn:hover {
  background: rgba(201,168,76,0.10);
  color: var(--gold-light);
  border-color: rgba(201,168,76,0.25);
}
.ig-page-btn.active {
  background: linear-gradient(135deg, var(--gold-dark), var(--gold));
  color: var(--navy-dark);
  border-color: transparent;
}

.ig-page-dots { color: rgba(255,255,255,.35); }
.ig-page-nav  { color: rgba(255,255,255,.55); }