/* ================================================================
   KazYouthDiplomacy — Inner Pages (Dashboard, Internships, etc.)
   Design: Clean Modern SaaS 2025
   Fonts: Syne (headings) + DM Sans (body)
================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&display=swap');

/* ── Design Tokens ─────────────────────────────────────────────── */
.inner-premium-page {
  --bg:            #ffffff;
  --bg-subtle:     #f9fafb;
  --bg-muted:      #f3f4f6;
  --text:          #0f1117;
  --muted:         #6b7280;
  --faint:         #9ca3af;
  --accent:        #3b6ef6;
  --accent-hover:  #2d5ce8;
  --accent-soft:   rgba(59,110,246,0.08);
  --accent-soft2:  rgba(59,110,246,0.14);
  --border:        #e5e7eb;
  --border-strong: #d1d5db;
  --success:       #16a34a;
  --success-soft:  rgba(22,163,74,0.09);
  --warning:       #d97706;
  --warning-soft:  rgba(217,119,6,0.10);
  --danger:        #dc2626;
  --danger-soft:   rgba(220,38,38,0.07);
  --radius-sm:     6px;
  --radius-md:     10px;
  --radius-lg:     14px;
  --shadow-sm:     0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:     0 4px 16px rgba(0,0,0,0.07);
  --shadow-lg:     0 8px 32px rgba(0,0,0,0.10);
  --ease:          cubic-bezier(0.22,1,0.36,1);

  /* Legacy aliases (keep for JS hooks) */
  --premium-bg:           var(--bg);
  --premium-text:         var(--text);
  --premium-muted:        var(--muted);
  --premium-accent:       var(--accent);
  --premium-accent-strong: var(--accent-hover);
  --premium-accent-soft:  var(--accent-soft);
  --premium-line:         var(--border);
  --premium-line-strong:  var(--border-strong);
  --premium-ease:         var(--ease);
  --premium-soft:         var(--bg-muted);
  --premium-surface:      var(--bg);
  --premium-radius-card:  var(--radius-md);
  --premium-radius-panel: var(--radius-lg);
  --premium-shadow-xs:    var(--shadow-sm);
  --premium-shadow-sm:    var(--shadow-sm);
  --premium-shadow-md:    var(--shadow-md);
  --premium-shadow-lg:    var(--shadow-lg);

  font-family: 'DM Sans', system-ui, sans-serif !important;
  background-color: var(--bg) !important;
  background-image: none !important;
  color: var(--text) !important;
  color-scheme: light !important;
  min-height: 100vh;
  letter-spacing: 0 !important;
}

/* Remove decorative pseudo-elements */
.inner-premium-page::before,
.inner-premium-page::after {
  display: none !important;
}

.inner-premium-page a {
  text-decoration: none !important;
  color: inherit !important;
}

/* Headings font */
.inner-premium-page h1,
.inner-premium-page h2,
.inner-premium-page h3,
.inner-premium-page h4 {
  font-family: 'Syne', system-ui, sans-serif !important;
  letter-spacing: -0.02em !important;
}

/* ── Page entrance animation ────────────────────────────────────── */
@keyframes innerReveal {
  from { transform: translateY(12px); }
  to   { transform: translateY(0); }
}

.inner-premium-page .dashboard-page,
.inner-premium-page .internships-page,
.inner-premium-page .subscribe-layout,
.inner-premium-page .opportunities-page,
.inner-premium-page .resources-page {
  animation: innerReveal 0.45s var(--ease) both;
  position: relative;
  z-index: 1;
}

/* ── Navigation — Clean full-width bar ──────────────────────────── */
body.inner-premium-page .premium-nav,
body.inner-premium-page .home-figma-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: 58px !important;
  min-height: unset !important;
  padding: 0 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  background: rgba(255,255,255,0.97) !important;
  border-bottom: 1px solid var(--border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transform: none !important;
  animation: none !important;
  z-index: 1000 !important;
  transition: background 0.2s ease !important;
}

body.inner-premium-page .home-figma-header::before,
body.inner-premium-page .home-figma-header::after {
  display: none !important;
}

/* Brand */
body.inner-premium-page .logo-wrap,
body.inner-premium-page .premium-brand,
.inner-premium-page .premium-brand {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 9px !important;
  color: var(--text) !important;
  font-family: 'Syne', system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
  text-decoration: none !important;
}

.inner-premium-page .premium-brand img {
  width: 32px !important;
  height: 32px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border) !important;
  background: #fff !important;
  box-shadow: none !important;
}

/* Nav menu */
body.inner-premium-page .home-figma-nav.premium-nav-menu,
.inner-premium-page .home-figma-nav.premium-nav-menu {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.inner-premium-page .premium-nav-links,
.inner-premium-page .premium-nav-actions {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
}

.inner-premium-page .premium-nav-links {
  gap: 2px !important;
  justify-content: center !important;
}

.inner-premium-page .premium-nav-actions {
  gap: 6px !important;
  justify-content: flex-end !important;
}

/* Nav links */
.inner-premium-page .premium-nav-links a {
  position: relative !important;
  min-height: 36px !important;
  padding: 0 12px !important;
  border-radius: 7px !important;
  color: var(--muted) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: color 0.18s ease, background 0.18s ease !important;
}

.inner-premium-page .premium-nav-links a:hover,
.inner-premium-page .premium-nav-links a:focus-visible {
  color: var(--text) !important;
  background: var(--bg-muted) !important;
  border-color: transparent !important;
  outline: none !important;
}

.inner-premium-page .premium-nav-links a[aria-current="page"] {
  color: var(--text) !important;
  font-weight: 600 !important;
  background: var(--bg-muted) !important;
}

/* Nav action buttons */
.inner-premium-page .premium-nav-actions .nav-btn,
.inner-premium-page .premium-nav-actions form button {
  min-height: 36px !important;
  padding: 0 14px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border) !important;
  background: transparent !important;
  color: var(--text) !important;
  font: inherit !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: background 0.18s ease, border-color 0.18s ease !important;
}

.inner-premium-page .premium-nav-actions .nav-btn:hover,
.inner-premium-page .premium-nav-actions form button:hover {
  background: var(--bg-muted) !important;
  border-color: var(--border-strong) !important;
  box-shadow: none !important;
}

/* Mobile hamburger */
.inner-premium-page .home-figma-header .card-nav-toggle {
  display: none !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg-subtle) !important;
  cursor: pointer !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  box-shadow: none !important;
}

.inner-premium-page .home-figma-header .card-nav-toggle span {
  display: block;
  width: 16px;
  height: 1.5px;
  border-radius: 99px;
  background: var(--text);
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.inner-premium-page .home-figma-header.card-nav-inline-header[data-mobile-nav-open="true"] .card-nav-toggle span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.inner-premium-page .home-figma-header.card-nav-inline-header[data-mobile-nav-open="true"] .card-nav-toggle span:nth-child(2) { opacity: 0; }
.inner-premium-page .home-figma-header.card-nav-inline-header[data-mobile-nav-open="true"] .card-nav-toggle span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }

/* ── Buttons ────────────────────────────────────────────────────── */
.inner-premium-page .btn {
  min-height: 42px !important;
  padding: 0 20px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  border: 1px solid transparent !important;
  transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease !important;
}

.inner-premium-page .btn::before,
.inner-premium-page .btn::after {
  display: none !important;
}

.inner-premium-page .btn.primary {
  color: #fff !important;
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  box-shadow: none !important;
}

.inner-premium-page .btn.primary:hover,
.inner-premium-page .btn.primary:focus-visible {
  background: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
  transform: translateY(-1px) !important;
  box-shadow: none !important;
  outline: none !important;
}

.inner-premium-page .btn.secondary {
  color: var(--text) !important;
  background: transparent !important;
  border-color: var(--border-strong) !important;
  box-shadow: none !important;
}

.inner-premium-page .btn.secondary:hover,
.inner-premium-page .btn.secondary:focus-visible {
  background: var(--bg-subtle) !important;
  border-color: var(--border-strong) !important;
  transform: translateY(-1px) !important;
  box-shadow: none !important;
  outline: none !important;
}

.inner-premium-page .btn:disabled {
  opacity: 0.45 !important;
  transform: none !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

.inner-premium-page .source-locked-btn {
  opacity: 0.6 !important;
  cursor: pointer !important;
}

/* ── Kickers / Badges ───────────────────────────────────────────── */
.inner-premium-page .dashboard-kicker,
.inner-premium-page .inner-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 24px !important;
  padding: 0 9px !important;
  border-radius: 6px !important;
  background: var(--accent-soft) !important;
  border: 1px solid var(--accent-soft2) !important;
  color: var(--accent) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
  margin: 0 !important;
}

.inner-premium-page .dashboard-kicker::before,
.inner-premium-page .inner-kicker::before {
  content: "" !important;
  display: block !important;
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: var(--accent) !important;
  flex-shrink: 0 !important;
}

.inner-premium-page .dashboard-badge {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 24px !important;
  padding: 0 10px !important;
  border-radius: 99px !important;
  background: var(--bg-subtle) !important;
  border: 1px solid var(--border) !important;
  color: var(--muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

/* ── Page layout — offset for fixed nav ─────────────────────────── */
body.inner-premium-page {
  background-color: var(--bg) !important;
  background-image: none !important;
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

.inner-premium-page .dashboard-page,
.inner-premium-page .internships-page,
.inner-premium-page .opportunities-page,
.inner-premium-page .resources-page {
  padding-top: 82px !important;
  background: transparent !important;
}

.inner-premium-page .subscribe-layout {
  padding-top: 82px !important;
  background: transparent !important;
}

/* ── Shared Card Base ───────────────────────────────────────────── */
.inner-premium-page .dashboard-card {
  position: relative !important;
  overflow: hidden !important;
  padding: 24px !important;
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  box-shadow: var(--shadow-sm) !important;
  display: grid !important;
  gap: 16px !important;
  transition: box-shadow 0.18s ease, border-color 0.18s ease, transform 0.18s ease !important;
}

.inner-premium-page .dashboard-card::before,
.inner-premium-page .dashboard-card::after {
  display: none !important;
}

.inner-premium-page .dashboard-card:hover {
  border-color: var(--border-strong) !important;
  box-shadow: var(--shadow-md) !important;
  transform: translateY(-2px) !important;
}

.inner-premium-page .dashboard-card h3 {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

.inner-premium-page .dashboard-card > p {
  margin: 0 !important;
  color: var(--muted) !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

/* ── Dashboard ──────────────────────────────────────────────────── */
.inner-premium-page .dashboard-page {
  width: 100% !important;
}

.inner-premium-page .dashboard-container {
  width: min(1100px, calc(100% - 48px)) !important;
  margin: 0 auto !important;
  padding-bottom: 80px !important;
  display: grid !important;
  gap: 14px !important;
}

.inner-premium-page .dashboard-page-head {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  margin-bottom: 2px !important;
}

.inner-premium-page .dashboard-container > h1,
.inner-premium-page .dashboard-page-head h1 {
  font-size: 40px !important;
  font-weight: 800 !important;
  color: var(--text) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.03em !important;
  margin: 12px 0 0 !important;
}

.inner-premium-page .dashboard-welcome-line {
  font-size: 15px !important;
  color: var(--muted) !important;
  margin: 0 0 4px !important;
}

/* Tabs */
.inner-premium-page .dashboard-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 3px !important;
  padding: 4px !important;
  border-radius: 10px !important;
  background: var(--bg-subtle) !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.inner-premium-page .dashboard-tab {
  min-height: 34px !important;
  padding: 0 13px !important;
  border-radius: 7px !important;
  color: var(--muted) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: color 0.18s ease, background 0.18s ease !important;
}

.inner-premium-page .dashboard-tab:hover {
  color: var(--text) !important;
  background: var(--bg-muted) !important;
}

/* Profile grid */
.inner-premium-page .dashboard-profile-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
}

.inner-premium-page .dashboard-profile-head > div {
  display: grid !important;
  gap: 8px !important;
}

.inner-premium-page .dashboard-profile-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.inner-premium-page .dashboard-profile-item {
  padding: 12px 14px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg-subtle) !important;
  transition: border-color 0.18s ease !important;
}

.inner-premium-page .dashboard-profile-item:hover {
  border-color: var(--border-strong) !important;
}

.inner-premium-page .dashboard-profile-item.dashboard-profile-item-wide {
  grid-column: 1 / -1 !important;
}

.inner-premium-page .dashboard-profile-item span {
  display: block !important;
  color: var(--faint) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  margin-bottom: 4px !important;
}

.inner-premium-page .dashboard-profile-item strong {
  color: var(--text) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* Roadmap grid */
.inner-premium-page .dashboard-roadmap-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.inner-premium-page .dashboard-roadmap-item {
  padding: 14px 16px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg-subtle) !important;
  transition: border-color 0.18s ease, background 0.18s ease !important;
}

.inner-premium-page .dashboard-roadmap-item:hover {
  border-color: var(--border-strong) !important;
  background: var(--bg-muted) !important;
}

.inner-premium-page .dashboard-roadmap-item span {
  display: block !important;
  color: var(--faint) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  margin-bottom: 4px !important;
}

.inner-premium-page .dashboard-roadmap-item strong {
  color: var(--text) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

.inner-premium-page .dashboard-roadmap-next {
  padding: 18px !important;
  border-radius: 8px !important;
  border: 1px solid var(--accent-soft2) !important;
  background: var(--accent-soft) !important;
  display: grid !important;
  gap: 8px !important;
}

.inner-premium-page .dashboard-roadmap-next h4 {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
}

.inner-premium-page .dashboard-roadmap-next > p {
  margin: 0 !important;
  color: var(--muted) !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
}

.inner-premium-page .dashboard-roadmap-steps-wrap,
.inner-premium-page .dashboard-roadmap-steps {
  display: grid !important;
  gap: 8px !important;
}

.inner-premium-page .dashboard-saved-list {
  display: grid !important;
  gap: 6px !important;
}

.inner-premium-page .career-summary-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

/* Content lock */
.inner-premium-page .content-lock-card {
  padding: 48px 32px !important;
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  box-shadow: var(--shadow-sm) !important;
  display: grid !important;
  gap: 16px !important;
  text-align: center !important;
  justify-items: center !important;
}

.inner-premium-page .content-lock-icon {
  font-size: 32px !important;
  line-height: 1 !important;
}

.inner-premium-page .content-lock-copy {
  display: grid !important;
  gap: 10px !important;
  max-width: 480px !important;
}

.inner-premium-page .content-lock-copy h2 {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
}

.inner-premium-page .content-lock-copy p {
  margin: 0 !important;
  color: var(--muted) !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
}

.inner-premium-page .content-lock-actions {
  display: flex !important;
  gap: 10px !important;
  justify-content: center !important;
}

/* ── Internships Page ───────────────────────────────────────────── */
.inner-premium-page .internships-page {
  width: min(1140px, calc(100% - 48px)) !important;
  margin: 0 auto !important;
  padding-bottom: 80px !important;
}

.inner-premium-page .internships-hero {
  padding-bottom: 24px !important;
}

.inner-premium-page .internships-hero-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin-bottom: 20px !important;
}

.inner-premium-page .internships-summary-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 26px !important;
  padding: 0 10px !important;
  border-radius: 6px !important;
  background: var(--accent-soft) !important;
  border: 1px solid var(--accent-soft2) !important;
  color: var(--accent) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}

.inner-premium-page .internships-summary-pill::before {
  content: "" !important;
  display: block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: var(--accent) !important;
  flex-shrink: 0 !important;
}

.inner-premium-page .internships-add-btn {
  min-height: 40px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
}

.inner-premium-page .internships-header h1 {
  font-size: 40px !important;
  font-weight: 800 !important;
  color: var(--text) !important;
  letter-spacing: -0.03em !important;
  line-height: 1.06 !important;
  margin: 0 0 8px !important;
}

.inner-premium-page .internships-header p {
  color: var(--muted) !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  margin: 0 !important;
}

/* Discovery panel */
.inner-premium-page .internships-discovery-panel {
  margin-top: 24px !important;
}

/* Search */
.inner-premium-page .internships-search-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 14px !important;
}

.inner-premium-page .internships-search-shell {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 48px !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  border: 1px solid var(--border-strong) !important;
  background: var(--bg) !important;
  box-shadow: none !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.inner-premium-page .internships-search-shell:focus-within {
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px var(--accent-soft) !important;
}

.inner-premium-page .internships-search-input {
  flex: 1 !important;
  min-width: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--text) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 16px !important;
  outline: none !important;
}

.inner-premium-page .internships-search-input::placeholder {
  color: var(--faint) !important;
}

.inner-premium-page .internships-search-actions {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

/* Toolbar buttons */
.inner-premium-page .internships-toolbar-btn {
  min-height: 48px !important;
  padding: 0 16px !important;
  border-radius: 8px !important;
  border: 1px solid var(--border-strong) !important;
  background: var(--bg) !important;
  color: var(--text) !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: border-color 0.18s ease, background 0.18s ease !important;
}

.inner-premium-page .internships-toolbar-btn:hover {
  border-color: var(--border-strong) !important;
  background: var(--bg-subtle) !important;
}

/* View switch */
.inner-premium-page .internships-view-switch {
  display: flex !important;
  border-radius: 8px !important;
  border: 1px solid var(--border-strong) !important;
  overflow: hidden !important;
  box-shadow: none !important;
}

.inner-premium-page .internships-view-btn {
  min-height: 48px !important;
  width: 44px !important;
  border: 0 !important;
  background: var(--bg) !important;
  color: var(--muted) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: color 0.18s ease, background 0.18s ease !important;
}

.inner-premium-page .internships-view-btn.active,
.inner-premium-page .internships-view-btn[aria-pressed="true"] {
  color: var(--accent) !important;
  background: var(--accent-soft) !important;
}

/* Filter chips */
.inner-premium-page .internships-filter-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-bottom: 12px !important;
}

.inner-premium-page .internships-filter-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border-radius: 99px !important;
  border: 1px solid var(--border-strong) !important;
  background: var(--bg) !important;
  color: var(--muted) !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease !important;
}

.inner-premium-page .internships-filter-chip:hover {
  border-color: var(--accent-soft2) !important;
  color: var(--text) !important;
  background: var(--bg-subtle) !important;
}

.inner-premium-page .internships-filter-chip.active {
  color: #fff !important;
  background: var(--accent) !important;
  border-color: var(--accent) !important;
  font-weight: 600 !important;
}

.inner-premium-page .internships-filter-chip-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 4px !important;
  border-radius: 99px !important;
  background: rgba(0,0,0,0.08) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

.inner-premium-page .internships-filter-chip.active .internships-filter-chip-count {
  background: rgba(255,255,255,0.25) !important;
}

/* Advanced filters */
.inner-premium-page .internships-advanced-filters {
  display: grid !important;
  grid-template-columns: 170px 1fr 170px !important;
  gap: 10px !important;
  margin-bottom: 4px !important;
}

.inner-premium-page .internships-advanced-field {
  display: grid !important;
  gap: 5px !important;
}

.inner-premium-page .internships-advanced-field span {
  color: var(--faint) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}

.inner-premium-page .internships-advanced-input {
  min-height: 40px !important;
  padding: 0 12px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border-strong) !important;
  background: var(--bg) !important;
  color: var(--text) !important;
  font: inherit !important;
  font-size: 13px !important;
  box-shadow: none !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.inner-premium-page .internships-advanced-input:focus {
  outline: none !important;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px var(--accent-soft) !important;
}

/* Internship Cards */
@keyframes cardStagger {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

.inner-premium-page .internships-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin-top: 20px !important;
}

.inner-premium-page .internship-modern {
  position: relative !important;
  overflow: hidden !important;
  padding: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  border-radius: var(--radius-md) !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  box-shadow: var(--shadow-sm) !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
  animation: cardStagger 0.4s var(--ease) both !important;
}

.inner-premium-page .internship-modern:nth-child(1)  { animation-delay: 0.04s !important; }
.inner-premium-page .internship-modern:nth-child(2)  { animation-delay: 0.08s !important; }
.inner-premium-page .internship-modern:nth-child(3)  { animation-delay: 0.12s !important; }
.inner-premium-page .internship-modern:nth-child(4)  { animation-delay: 0.16s !important; }
.inner-premium-page .internship-modern:nth-child(5)  { animation-delay: 0.20s !important; }
.inner-premium-page .internship-modern:nth-child(6)  { animation-delay: 0.24s !important; }
.inner-premium-page .internship-modern:nth-child(n+7){ animation-delay: 0.28s !important; }

.inner-premium-page .internship-modern::before,
.inner-premium-page .internship-modern::after {
  display: none !important;
}

.inner-premium-page .internship-modern:hover {
  transform: translateY(-3px) !important;
  border-color: var(--border-strong) !important;
  box-shadow: var(--shadow-md) !important;
}

.inner-premium-page .internship-modern.recommended-surface {
  border-color: var(--accent-soft2) !important;
  background: linear-gradient(180deg, var(--accent-soft) 0%, var(--bg) 60%) !important;
}

.inner-premium-page .internship-modern h3 {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.3 !important;
}

.inner-premium-page .internship-modern .internship-organization {
  margin: 0 !important;
  color: var(--accent) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

.inner-premium-page .internship-modern > p:not(.internship-organization):not(.match-note) {
  margin: 0 !important;
  color: var(--muted) !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Badges */
.inner-premium-page .card-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
}

.inner-premium-page .badge {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  padding: 0 8px !important;
  border-radius: 99px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
}

.inner-premium-page .badge.internship {
  color: var(--accent) !important;
  background: var(--accent-soft) !important;
}

.inner-premium-page .badge.vacancy {
  color: var(--warning) !important;
  background: var(--warning-soft) !important;
}

.inner-premium-page .badge.kazakhstan {
  color: var(--success) !important;
  background: var(--success-soft) !important;
}

.inner-premium-page .badge.international {
  color: #5b2fbc !important;
  background: rgba(91,47,188,0.08) !important;
}

.inner-premium-page .badge.online,
.inner-premium-page .badge.green {
  color: var(--success) !important;
  background: var(--success-soft) !important;
}

.inner-premium-page .badge.gray {
  color: var(--muted) !important;
  background: var(--bg-muted) !important;
}

.inner-premium-page .badge.match {
  color: #fff !important;
  background: var(--accent) !important;
}

/* Meta row */
.inner-premium-page .internship-modern .meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
  margin-top: auto !important;
}

.inner-premium-page .internship-modern .meta span {
  min-height: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 8px !important;
  border-radius: 99px !important;
  background: var(--bg-muted) !important;
  color: var(--muted) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

.inner-premium-page .internship-modern .internship-deadline-urgent {
  color: var(--danger) !important;
  background: var(--danger-soft) !important;
}

/* Tags */
.inner-premium-page .taxonomy-chips {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

.inner-premium-page .taxonomy-chip {
  min-height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 7px !important;
  border-radius: 4px !important;
  background: var(--accent-soft) !important;
  color: var(--accent) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
}

/* Saved chips */
.inner-premium-page .saved-controls {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 5px !important;
}

.inner-premium-page .status-chip {
  min-height: 28px !important;
  padding: 0 10px !important;
  border-radius: 99px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  color: var(--muted) !important;
  font: inherit !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease !important;
}

.inner-premium-page .status-chip.active {
  color: var(--accent) !important;
  background: var(--accent-soft) !important;
  border-color: var(--accent-soft2) !important;
}

.inner-premium-page .status-chip.muted {
  opacity: 0.55 !important;
}

/* Card actions */
.inner-premium-page .card-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-top: auto !important;
}

.inner-premium-page .card-actions .btn {
  flex: 1 1 auto !important;
  min-height: 36px !important;
  font-size: 13px !important;
}

/* Match note */
.inner-premium-page .match-note {
  margin: 0 !important;
  padding: 8px 11px !important;
  border-radius: 5px !important;
  background: var(--accent-soft) !important;
  color: var(--accent) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

/* Internship form */
.inner-premium-page .internship-form {
  padding: 24px !important;
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  box-shadow: var(--shadow-sm) !important;
  display: grid !important;
  gap: 16px !important;
  margin-bottom: 24px !important;
}

.inner-premium-page .internship-form h2 {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

.inner-premium-page .internship-form-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.inner-premium-page .internship-form input,
.inner-premium-page .internship-form select,
.inner-premium-page .internship-form textarea {
  min-height: 42px !important;
  padding: 0 12px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border-strong) !important;
  background: var(--bg-subtle) !important;
  color: var(--text) !important;
  font: inherit !important;
  font-size: 14px !important;
  transition: border-color 0.18s ease, box-shadow 0.18s ease !important;
}

.inner-premium-page .internship-form input:focus,
.inner-premium-page .internship-form select:focus,
.inner-premium-page .internship-form textarea:focus {
  outline: none !important;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px var(--accent-soft) !important;
}

.inner-premium-page .internship-form-actions {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

.inner-premium-page .internship-form-status {
  color: var(--muted) !important;
  font-size: 13px !important;
}

/* Goal focus */
.inner-premium-page .goal-focus {
  padding: 20px !important;
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--accent-soft2) !important;
  background: var(--accent-soft) !important;
  display: grid !important;
  gap: 14px !important;
}

.inner-premium-page .goal-focus-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
}

.inner-premium-page .goal-focus-head > div {
  display: grid !important;
  gap: 8px !important;
}

.inner-premium-page .goal-focus-head h2 {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

.inner-premium-page .goal-focus-description {
  margin: 0 !important;
  color: var(--muted) !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

.inner-premium-page .goal-focus-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

/* Empty states */
.inner-premium-page .internships-empty,
.inner-premium-page .opportunities-empty,
.inner-premium-page .resources-empty {
  padding: 40px !important;
  text-align: center !important;
  color: var(--muted) !important;
  font-size: 15px !important;
}

/* ── Subscribe / Pricing ────────────────────────────────────────── */
.inner-premium-page .subscribe-layout {
  width: min(1100px, calc(100% - 48px)) !important;
  margin: 0 auto !important;
  display: grid !important;
  gap: 20px !important;
  padding-bottom: 80px !important;
}

.inner-premium-page .subscribe-head {
  max-width: 700px !important;
}

.inner-premium-page .subscribe-head h1 {
  margin: 0 0 12px !important;
  color: var(--text) !important;
  font-size: 40px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.06 !important;
}

.inner-premium-page .subscribe-head p {
  margin: 0 !important;
  color: var(--muted) !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
}

/* Value strip */
.inner-premium-page .subscribe-value-strip {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.inner-premium-page .subscribe-value-pill {
  padding: 18px 20px !important;
  border-radius: 8px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  box-shadow: none !important;
  display: grid !important;
  gap: 6px !important;
  transition: border-color 0.18s ease !important;
}

.inner-premium-page .subscribe-value-pill:hover {
  border-color: var(--border-strong) !important;
}

.inner-premium-page .subscribe-value-pill strong {
  color: var(--accent) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  display: block !important;
}

.inner-premium-page .subscribe-value-pill span {
  color: var(--muted) !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
  display: block !important;
}

/* Flow steps */
.inner-premium-page .subscribe-flow-card {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.inner-premium-page .subscribe-flow-step {
  padding: 20px !important;
  border-radius: 8px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  display: grid !important;
  gap: 10px !important;
  transition: border-color 0.18s ease !important;
}

.inner-premium-page .subscribe-flow-step:hover {
  border-color: var(--border-strong) !important;
}

.inner-premium-page .subscribe-flow-step > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  background: var(--accent) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
  box-shadow: none !important;
}

.inner-premium-page .subscribe-flow-step strong {
  color: var(--text) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

.inner-premium-page .subscribe-flow-step > p {
  margin: 0 !important;
  color: var(--muted) !important;
  font-size: 14px !important;
  line-height: 1.68 !important;
}

/* Plans Grid */
.inner-premium-page .plans-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: start !important;
}

.inner-premium-page .plan-card {
  position: relative !important;
  overflow: hidden !important;
  padding: 22px !important;
  border-radius: var(--radius-md) !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}

.inner-premium-page .plan-card::before,
.inner-premium-page .plan-card::after {
  display: none !important;
}

.inner-premium-page .plan-card:hover {
  transform: translateY(-3px) !important;
  border-color: var(--border-strong) !important;
  box-shadow: var(--shadow-md) !important;
}

.inner-premium-page .plan-card.featured {
  border-color: var(--accent) !important;
  border-width: 2px !important;
  background: var(--bg) !important;
  box-shadow: none !important;
}

.inner-premium-page .plan-card.featured:hover {
  box-shadow: 0 8px 24px var(--accent-soft) !important;
}

.inner-premium-page .plan-badge {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 22px !important;
  padding: 0 8px !important;
  border-radius: 99px !important;
  background: var(--accent-soft) !important;
  color: var(--accent) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  align-self: flex-start !important;
}

.inner-premium-page .plan-card h2 {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em !important;
}

.inner-premium-page .plan-price {
  font-size: 32px !important;
  font-weight: 800 !important;
  color: var(--text) !important;
  letter-spacing: -0.04em !important;
  line-height: 1 !important;
}

.inner-premium-page .plan-payment-info {
  color: var(--muted) !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
  margin: 0 !important;
}

.inner-premium-page .plan-features {
  margin: 0 0 16px !important;
  padding: 0 !important;
  flex: 1 !important;
  list-style: none !important;
  display: grid !important;
  gap: 8px !important;
}

.inner-premium-page .plan-features li {
  position: relative !important;
  padding-left: 18px !important;
  color: var(--muted) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
}

.inner-premium-page .plan-features li::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 5px !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  border: 2px solid var(--accent) !important;
  background: transparent !important;
}

.inner-premium-page .plan-card.featured .plan-features li::before {
  background: var(--accent) !important;
}

.inner-premium-page .plan-btn {
  width: 100% !important;
  margin-top: auto !important;
}

.inner-premium-page .plan-followup {
  margin-top: 8px !important;
  text-align: center !important;
}

.inner-premium-page .plan-inline-link {
  color: var(--accent) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* Compare */
.inner-premium-page .subscribe-compare {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.inner-premium-page .subscribe-compare-card {
  padding: 22px !important;
  border-radius: 8px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  display: grid !important;
  gap: 14px !important;
}

.inner-premium-page .subscribe-compare-card.subscribe-compare-highlight {
  border-color: var(--accent-soft2) !important;
  background: var(--accent-soft) !important;
}

.inner-premium-page .subscribe-compare-card h3 {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
}

.inner-premium-page .subscribe-status:not(:empty),
.inner-premium-page .subscribe-note {
  padding: 14px 16px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg-subtle) !important;
  color: var(--muted) !important;
  font-size: 13px !important;
  line-height: 1.65 !important;
}

/* Kaspi widget */
.inner-premium-page .kaspi-widget-backdrop {
  position: fixed !important;
  inset: 0 !important;
  z-index: 798 !important;
  background: rgba(15,17,23,0.3) !important;
  backdrop-filter: blur(4px) !important;
}

.inner-premium-page .kaspi-widget {
  position: fixed !important;
  bottom: 24px !important;
  right: 24px !important;
  z-index: 800 !important;
  width: min(520px, calc(100vw - 32px)) !important;
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  box-shadow: var(--shadow-lg) !important;
  overflow: hidden !important;
}

.inner-premium-page .kaspi-widget-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 20px 20px 14px !important;
  border-bottom: 1px solid var(--border) !important;
}

.inner-premium-page .kaspi-widget-kicker {
  display: inline-block !important;
  min-height: 22px !important;
  padding: 0 8px !important;
  border-radius: 5px !important;
  background: var(--accent-soft) !important;
  color: var(--accent) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  margin-bottom: 8px !important;
  line-height: 22px !important;
}

.inner-premium-page .kaspi-widget-head h2 {
  margin: 0 !important;
  color: var(--text) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

.inner-premium-page .kaspi-widget-meta {
  margin: 5px 0 0 !important;
  color: var(--muted) !important;
  font-size: 13px !important;
}

.inner-premium-page .kaspi-widget-close {
  width: 32px !important;
  height: 32px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border) !important;
  background: transparent !important;
  color: var(--muted) !important;
  font-size: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  transition: background 0.18s ease !important;
}

.inner-premium-page .kaspi-widget-close:hover {
  background: var(--bg-muted) !important;
}

.inner-premium-page .kaspi-widget-frame-wrap {
  padding: 16px 20px 20px !important;
}

.inner-premium-page .kaspi-widget-frame {
  width: 100% !important;
  min-height: 360px !important;
  border: 0 !important;
  border-radius: 7px !important;
}

/* Back arrow */
.inner-premium-page .page-home-arrow {
  position: fixed !important;
  top: 12px !important;
  left: max(20px, calc(50% - 590px)) !important;
  z-index: 1001 !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 7px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--text) !important;
  transition: background 0.18s ease !important;
}

.inner-premium-page .page-home-arrow:hover {
  background: var(--bg-muted) !important;
}

/* ── Opportunities / Resources ──────────────────────────────────── */
.inner-premium-page .opportunities-page,
.inner-premium-page .resources-page {
  width: min(1140px, calc(100% - 48px)) !important;
  margin: 0 auto !important;
  padding-bottom: 80px !important;
}

.inner-premium-page .opportunities-header,
.inner-premium-page .resources-header {
  margin-bottom: 28px !important;
}

.inner-premium-page .opportunities-header h1,
.inner-premium-page .resources-header h1 {
  font-size: 40px !important;
  font-weight: 800 !important;
  color: var(--text) !important;
  letter-spacing: -0.03em !important;
  line-height: 1.06 !important;
  margin: 0 0 8px !important;
}

.inner-premium-page .opportunities-header p,
.inner-premium-page .resources-header p {
  color: var(--muted) !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  margin: 0 !important;
}

.inner-premium-page .opportunities-controls,
.inner-premium-page .resources-controls {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-bottom: 24px !important;
}

.inner-premium-page .opportunities-grid,
.inner-premium-page .resources-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin-top: 20px !important;
}

/* ── Filter pills (shared) ──────────────────────────────────────── */
.inner-premium-page .filters-modern {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

.inner-premium-page .filter {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 0 14px !important;
  border-radius: 99px !important;
  border: 1px solid var(--border-strong) !important;
  background: var(--bg) !important;
  color: var(--muted) !important;
  font: inherit !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease !important;
}

.inner-premium-page .filter:hover {
  color: var(--text) !important;
  background: var(--bg-subtle) !important;
}

.inner-premium-page .filter.active {
  background: var(--accent) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
  font-weight: 600 !important;
}

/* ── Onboarding Banner ──────────────────────────────────────────── */
.onboarding-banner {
  opacity: 0;
  transform: translateY(-12px);
  transition: opacity 0.4s var(--ease, cubic-bezier(0.22,1,0.36,1)), transform 0.4s var(--ease, cubic-bezier(0.22,1,0.36,1));
  margin-bottom: 20px;
}

.onboarding-banner.onboarding-visible {
  opacity: 1;
  transform: translateY(0);
}

.onboarding-banner.onboarding-hiding {
  opacity: 0;
  transform: translateY(-8px);
  pointer-events: none;
}

.onboarding-inner {
  position: relative;
  background: var(--accent-soft);
  border: 1px solid var(--accent-soft2);
  border-radius: 12px;
  padding: 24px 26px 20px;
  overflow: hidden;
}

.onboarding-inner::before,
.onboarding-inner::after {
  display: none !important;
}

.onboarding-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}

.onboarding-title-row h2 {
  font-family: 'Syne', sans-serif !important;
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  color: var(--text) !important;
  margin: 0 0 4px !important;
  letter-spacing: -0.02em !important;
}

.onboarding-subtitle {
  font-size: 0.87rem;
  color: var(--muted);
  margin: 0;
}

.onboarding-dismiss {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid var(--border);
  background: var(--bg);
  border-radius: 7px;
  cursor: pointer;
  color: var(--muted);
  flex-shrink: 0;
  transition: background 0.18s, color 0.18s;
}

.onboarding-dismiss:hover {
  background: var(--bg-muted);
  color: var(--text);
}

.onboarding-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}

.onboarding-step {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 16px;
  border-radius: 8px;
  background: var(--bg);
  border: 1px solid var(--border);
  transition: border-color 0.18s, transform 0.18s;
}

.onboarding-step:hover {
  border-color: var(--accent-soft2);
  transform: translateY(-1px);
}

.onboarding-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 7px;
  background: var(--accent-soft);
  border: 1px solid var(--accent-soft2);
  font-family: 'Syne', sans-serif;
  font-size: 0.72rem;
  font-weight: 800;
  color: var(--accent);
  letter-spacing: 0.04em;
  flex-shrink: 0;
}

.onboarding-step-body strong {
  display: block;
  font-size: 0.87rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 3px;
}

.onboarding-step-body span {
  display: block;
  font-size: 0.8rem;
  color: var(--muted);
  line-height: 1.45;
}

.onboarding-step-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--accent);
  text-decoration: none;
  margin-top: auto;
  padding-top: 6px;
  transition: gap 0.18s;
}

.onboarding-step-link:hover { gap: 7px; }

.onboarding-progress-row {
  display: flex;
  align-items: center;
  gap: 14px;
}

.onboarding-progress-label {
  font-size: 0.82rem;
  color: var(--muted);
  white-space: nowrap;
  flex-shrink: 0;
}

.onboarding-progress-label strong {
  color: var(--accent);
  font-weight: 700;
}

.onboarding-progress-track {
  flex: 1;
  height: 5px;
  background: var(--border);
  border-radius: 99px;
  overflow: hidden;
}

.onboarding-progress-fill {
  height: 100%;
  background: var(--accent);
  border-radius: 99px;
  width: 0%;
  transition: width 0.9s var(--ease, cubic-bezier(0.22,1,0.36,1));
}

/* ── Empty States ───────────────────────────────────────────────── */
.inner-premium-page .premium-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 60px 32px 56px;
  border: 1.5px dashed var(--border-strong);
  border-radius: 12px;
  background: var(--bg-subtle);
  margin: 8px 0 24px;
}

.inner-premium-page .premium-empty-icon {
  margin-bottom: 20px;
  opacity: 0.7;
}

.inner-premium-page .premium-empty-state h3 {
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: var(--text) !important;
  margin: 0 0 10px !important;
}

.inner-premium-page .premium-empty-state p {
  color: var(--muted) !important;
  font-size: 0.9rem !important;
  line-height: 1.65 !important;
  max-width: 400px !important;
  margin: 0 0 24px !important;
}

.inner-premium-page .premium-empty-state .btn {
  min-width: 160px !important;
}

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  body.inner-premium-page .home-figma-header.card-nav-inline-header,
  .inner-premium-page .home-figma-header.card-nav-inline-header {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 0 16px !important;
    overflow: visible !important;
  }

  .inner-premium-page .home-figma-header.card-nav-inline-header .logo-wrap,
  .inner-premium-page .home-figma-header.card-nav-inline-header .premium-brand {
    order: 1 !important;
    flex: 0 0 auto !important;
  }

  .inner-premium-page .home-figma-header.card-nav-inline-header .card-nav-toggle {
    display: inline-flex !important;
    order: 2 !important;
    flex-shrink: 0 !important;
    margin-left: auto !important;
  }

  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline {
    display: none !important;
    position: absolute !important;
    top: calc(100% + 4px) !important;
    left: 0 !important;
    right: 0 !important;
    order: 3 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
    padding: 12px !important;
    border-radius: 10px !important;
    border: 1px solid var(--border) !important;
    background: var(--bg) !important;
    box-shadow: var(--shadow-lg) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    z-index: 1100 !important;
    flex: none !important;
    margin: 0 !important;
  }

  body.inner-premium-page .home-figma-header.card-nav-inline-header[data-mobile-nav-open="true"] nav.card-nav-inline {
    display: flex !important;
  }

  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .premium-nav-links,
  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .card-nav-links,
  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .premium-nav-actions,
  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .card-nav-actions {
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 3px !important;
    justify-content: flex-start !important;
  }

  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .premium-nav-links a,
  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .card-nav-links a,
  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .premium-nav-actions .nav-btn,
  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .premium-nav-actions form button,
  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .card-nav-actions .nav-btn,
  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .card-nav-actions form button {
    width: 100% !important;
    justify-content: flex-start !important;
    min-height: 44px !important;
  }

  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .premium-nav-actions,
  body.inner-premium-page .home-figma-header.card-nav-inline-header nav.card-nav-inline .card-nav-actions {
    padding-top: 8px !important;
    border-top: 1px solid var(--border) !important;
  }

  .inner-premium-page .plans-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 900px) {
  .inner-premium-page .dashboard-profile-grid,
  .inner-premium-page .dashboard-roadmap-grid {
    grid-template-columns: 1fr !important;
  }

  .inner-premium-page .internships-grid,
  .inner-premium-page .opportunities-grid,
  .inner-premium-page .resources-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .inner-premium-page .goal-focus-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .inner-premium-page .subscribe-compare,
  .inner-premium-page .subscribe-flow-card,
  .inner-premium-page .subscribe-value-strip {
    grid-template-columns: 1fr !important;
  }

  .inner-premium-page .internships-advanced-filters {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 640px) {
  body.inner-premium-page .home-figma-header {
    padding: 0 16px !important;
    overflow: visible !important;
  }

  .inner-premium-page .dashboard-page,
  .inner-premium-page .internships-page,
  .inner-premium-page .subscribe-layout,
  .inner-premium-page .opportunities-page,
  .inner-premium-page .resources-page {
    padding-top: 74px !important;
    width: calc(100% - 32px) !important;
  }

  .inner-premium-page .dashboard-container {
    width: 100% !important;
  }

  .inner-premium-page .dashboard-container > h1,
  .inner-premium-page .dashboard-page-head h1,
  .inner-premium-page .internships-header h1,
  .inner-premium-page .subscribe-head h1,
  .inner-premium-page .opportunities-header h1,
  .inner-premium-page .resources-header h1 {
    font-size: 30px !important;
  }

  .inner-premium-page .internships-grid,
  .inner-premium-page .opportunities-grid,
  .inner-premium-page .resources-grid {
    grid-template-columns: 1fr !important;
  }

  .inner-premium-page .plans-grid {
    grid-template-columns: 1fr !important;
  }

  .inner-premium-page .internship-form-grid {
    grid-template-columns: 1fr !important;
  }

  .inner-premium-page .internships-search-row {
    flex-wrap: wrap !important;
  }

  .inner-premium-page .goal-focus-grid {
    grid-template-columns: 1fr !important;
  }

  .inner-premium-page .goal-focus-head {
    flex-direction: column !important;
  }

  .inner-premium-page .page-home-arrow {
    display: none !important;
  }

  .inner-premium-page .opportunities-controls,
  .inner-premium-page .resources-controls {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px !important;
  }

  .inner-premium-page .card-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .inner-premium-page .card-actions .btn {
    width: 100% !important;
    justify-content: center !important;
  }

  .inner-premium-page .filters-modern {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    padding-bottom: 4px !important;
  }

  .inner-premium-page .filters-modern::-webkit-scrollbar {
    display: none !important;
  }

  .inner-premium-page .filters-modern .filter {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
  }

  .inner-premium-page .onboarding-inner {
    padding: 18px 16px 16px !important;
  }
}

@media (max-width: 760px) {
  .onboarding-steps {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .onboarding-step {
    flex-direction: row;
    align-items: center;
    gap: 12px;
  }

  .onboarding-step-body {
    flex: 1;
    min-width: 0;
  }

  .onboarding-step-link {
    padding-top: 0;
    white-space: nowrap;
  }
}

@media (max-width: 480px) {
  body.inner-premium-page .home-figma-header {
    padding: 0 12px !important;
  }

  .inner-premium-page .dashboard-page,
  .inner-premium-page .internships-page,
  .inner-premium-page .opportunities-page,
  .inner-premium-page .resources-page {
    padding-top: 70px !important;
  }

  .inner-premium-page .dashboard-container,
  .inner-premium-page .internships-page,
  .inner-premium-page .opportunities-page,
  .inner-premium-page .resources-page {
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  .inner-premium-page .dashboard-tabs {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    flex-wrap: nowrap !important;
    padding-bottom: 4px !important;
  }

  .inner-premium-page .dashboard-tabs::-webkit-scrollbar { display: none !important; }
  .inner-premium-page .dashboard-tab { flex-shrink: 0 !important; white-space: nowrap !important; }

  .inner-premium-page .btn {
    font-size: 13px !important;
    padding: 0 14px !important;
  }
}

@media (max-width: 380px) {
  .inner-premium-page .dashboard-container > h1,
  .inner-premium-page .dashboard-page-head h1,
  .inner-premium-page .internships-header h1,
  .inner-premium-page .opportunities-header h1,
  .inner-premium-page .resources-header h1 {
    font-size: 24px !important;
  }
}

/* Mobile touch improvements */
.inner-premium-page a,
.inner-premium-page button,
.inner-premium-page label,
.inner-premium-page [role="button"] {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.inner-premium-page input,
.inner-premium-page select,
.inner-premium-page textarea {
  font-size: 16px !important;
}

/* Safe area */
@supports (padding: max(0px)) {
  body.inner-premium-page .home-figma-header {
    padding-left: max(24px, env(safe-area-inset-left)) !important;
    padding-right: max(24px, env(safe-area-inset-right)) !important;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .inner-premium-page *,
  .inner-premium-page *::before,
  .inner-premium-page *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Smooth scroll */
@media (prefers-reduced-motion: no-preference) {
  .inner-premium-page { scroll-behavior: smooth; }
}

.inner-premium-page { -webkit-overflow-scrolling: touch; }

/* iOS no-backdrop fallback */
@supports not (backdrop-filter: blur(1px)) {
  body.inner-premium-page .home-figma-header {
    background: rgba(255,255,255,0.99) !important;
  }
}

/* ================================================================
   HIDDEN ATTRIBUTE OVERRIDE — must be last
================================================================= */
html .inner-premium-page [hidden] {
  display: none !important;
}