/*
  Globe Glide theme: modern, high-contrast, and friendly defaults
  - Adds bold headings and improved typography
  - Polishes navbar, buttons, cards, and forms
  - Provides small utility classes used in the HTML (Tailwind-like shims)
*/

:root {
  /* Brand palette */
  --brand-bg: #0b1220;            /* deep navy */
  --brand-bg-2: #101b2d;          /* navy gradient end */
  --brand-primary: #2563eb;       /* blue-600 */
  --brand-primary-2: #7c3aed;     /* violet-600 */
  --brand-accent: #f59e0b;        /* amber-500 */
  --brand-accent-2: #d97706;      /* amber-600 */
  --brand-text: #0f172a;          /* slate-900 */
  --brand-muted: #64748b;         /* slate-500 */
  --surface: #ffffff;             /* cards and sections */

  --radius-md: 12px;
  --radius-lg: 16px;
  --shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.12);
  --shadow-md: 0 10px 20px rgba(15, 23, 42, 0.12);
  --shadow-lg: 0 18px 30px rgba(15, 23, 42, 0.16);
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Nunito', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  color: var(--brand-text);
  background-color: #ffffff; /* force white background sitewide */
  line-height: 1.6;
}

/* Typography: bold, confident headings */
h1, h2, h3 {
  font-weight: 800 !important;
  letter-spacing: 0.2px;
  line-height: 1.15;
}
h4, h5, h6 { font-weight: 700; }

/* Links */
a { color: var(--brand-primary); text-decoration: none; transition: color .2s ease, text-underline-offset .2s ease; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Navbar polish */
.navbar.bg-black {
  background: linear-gradient(90deg, var(--brand-bg) 0%, var(--brand-bg-2) 100%) !important;
  box-shadow: var(--shadow-sm);
}
.navbar .navbar-brand img { height: 48px; width: auto; }
.navbar .nav-link { font-weight: 700; letter-spacing: .2px; }

/* Buttons */
.btn-primary {
  color: #fff !important;
  background: linear-gradient(90deg, var(--brand-primary) 0%, var(--brand-primary-2) 100%);
  border: 0;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .35);
  transition: transform .15s ease, box-shadow .2s ease, filter .2s ease;
}
.btn-primary:hover { filter: brightness(1.05); transform: translateY(-1px); box-shadow: var(--shadow-md); }

.btn-warning {
  color: #1f2937 !important;
  background: linear-gradient(90deg, var(--brand-accent) 0%, var(--brand-accent-2) 100%);
  border: 0;
  box-shadow: 0 6px 16px rgba(245, 158, 11, .35);
  font-weight: 800;
}
.btn-warning:hover { filter: brightness(1.06); transform: translateY(-1px); box-shadow: var(--shadow-md); }

.btn { border-radius: 999px; padding: .6rem 1.2rem; }

/* Cards */
.card {
  border: 0;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease;
}
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.card .card-img-top { border-top-left-radius: var(--radius-lg); border-top-right-radius: var(--radius-lg); }
.card .card-title { font-weight: 800; }
.card .card-text { color: var(--brand-muted); }

/* Feature list with checkmarks */
.feature-list { list-style: none; padding: 0; margin: 0; }
.feature-list li {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  margin-bottom: .5rem;
}
.feature-list li::before {
  content: "\2713"; /* ✓ */
  color: var(--brand-accent);
  font-weight: 900;
  margin-top: 2px;
}

/* Sections */
.section { padding: 4rem 0; }
.section-narrow { padding: 2rem 0; }
.section-title { font-weight: 800; text-align: center; margin-bottom: 1.25rem; }
.section-subtitle { text-align: center; color: var(--brand-muted); margin-bottom: 2.5rem; }

/* Forms */
.form-control {
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  padding: .8rem 1rem;
}
.form-control:focus { border-color: var(--brand-primary); box-shadow: 0 0 0 0.25rem rgba(37, 99, 235, .15); }
.input-group-text { border-radius: 12px; }

/* Footer (if present) */
footer { background: linear-gradient(90deg, var(--brand-bg) 0%, var(--brand-bg-2) 100%); color: #cbd5e1; }
footer a { color: #e2e8f0; }
footer a:hover { color: #fff; }

/* Swiper tweaks */
.swiper .swiper-pagination-bullet { background: #fff; opacity: .8; }
.swiper .swiper-pagination-bullet-active { background: var(--brand-accent); opacity: 1; }

/* Utility shims (selective Tailwind-like mappings actually used in pages) */
.antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.w-28 { width: 7rem; }
.h-16 { height: 4rem; }

/* Responsive text sizes */
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
.text-8xl { font-size: 6rem; line-height: 1; }
@media (min-width: 768px) {
  .md\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
  .md\:text-8xl { font-size: 6rem; line-height: 1; }
  .md\:mx-12 { margin-left: 3rem !important; margin-right: 3rem !important; }
}

.text-yellow-600 { color: #ca8a04 !important; }
.fw-bold { font-weight: 800 !important; }

/* Flex helpers */
.flex { display: flex; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.text-center { text-align: center; }
.my-8 { margin-top: 2rem !important; margin-bottom: 2rem !important; }

/* Gradient background utilities used on <body> */
.bg-gradient-to-r {
  --gradient-from: #f9a8d4; /* default pink-300 */
  --gradient-via: #c4b5fd; /* default purple-300 */
  --gradient-to: #818cf8;   /* default indigo-400 */
  background-image: linear-gradient(to right, var(--gradient-from), var(--gradient-via), var(--gradient-to));
  background-attachment: fixed;
}
.from-pink-300 { --gradient-from: #f9a8d4; }
.via-purple-30 { --gradient-via: #d8b4fe; } /* graceful fallback for existing class */
.via-purple-300 { --gradient-via: #c4b5fd; }
.to-indigo-400 { --gradient-to: #818cf8; }

/* Ensure body stays white even if gradient utility is present */
body.bg-gradient-to-r {
  background-image: none !important;
  background-color: #ffffff !important;
}

/* Subtle separators */
.divider { height: 1px; background: linear-gradient(90deg, transparent, #e5e7eb, transparent); margin: 2rem 0; }

/* Subtle hover for nav items */
.navbar .nav-link { position: relative; }
.navbar .nav-link::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -4px; height: 2px;
  background: linear-gradient(90deg, var(--brand-accent), var(--brand-primary));
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .2s ease;
}
.navbar .nav-link:hover::after { transform: scaleX(1); }

/* Improve list readability inside content areas */
.content ul { padding-left: 1.25rem; }
.content li { margin-bottom: .5rem; }