/* Pedestal Management Training Institute: public site theme.
   Bootstrap 5 base, overridden with PMTI brand variables (navy + orange).
   Depth-led design system: soft navy-tinted shadows, elevated cards, orange
   accents on interaction. Palette stays navy + orange + neutrals. */

:root {
  --pmti-primary:      #1b3a5c;
  --pmti-primary-dark: #142c46;
  --pmti-primary-2:    #2c567f;   /* lighter navy for gradients */
  --pmti-accent:       #e2661f;
  --pmti-accent-2:     #ef7a2c;   /* lighter orange for gradients */
  --pmti-accent-dark:  #c4531a;
  --pmti-cream:        #f7f4ee;
  --pmti-ink:          #172033;
  --pmti-muted:        #5b6778;
  --pmti-bg:           #fbfcfe;
  --pmti-surface:      #f4f7fb;
  --pmti-tint:         #eef3f9;   /* soft navy tint for alt sections */
  --pmti-accent-tint:  #fcefe4;   /* soft orange tint */
  --pmti-border:       #e6ebf2;

  --radius:    16px;
  --radius-lg: 22px;
  --shadow-sm:    0 1px 2px rgba(23,32,51,.05), 0 2px 6px rgba(23,32,51,.05);
  --shadow-md:    0 6px 20px rgba(27,58,92,.09);
  --shadow-lg:    0 18px 44px rgba(27,58,92,.13);
  --shadow-hover: 0 24px 52px rgba(27,58,92,.19);

  --bs-primary:        var(--pmti-primary);
  --bs-primary-rgb:    27, 58, 92;
  --bs-link-color:     var(--pmti-primary);
  --bs-link-hover-color: var(--pmti-primary-dark);
  --bs-secondary-color: #4b5563;
  --bs-body-color:     var(--pmti-ink);
  --bs-body-bg:        var(--pmti-bg);
  --bs-border-color:   var(--pmti-border);
  color-scheme: light;
}

html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 16px;
  color: var(--pmti-ink);
  background: var(--pmti-bg);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
h1,h2,h3,h4,h5,h6 { font-family: 'Poppins', system-ui, sans-serif; font-weight: 700; color: var(--pmti-ink); letter-spacing: -.01em; }
.text-muted { color: var(--pmti-muted) !important; }
a { color: var(--pmti-primary); text-decoration: none; transition: color .15s; }
a:hover { color: var(--pmti-primary-dark); text-decoration: underline; text-underline-offset: 3px; }
.lead { color: var(--pmti-muted); }
::selection { background: rgba(226,102,31,.22); }

/* Inputs: 16px prevents iOS zoom; 44px touch targets */
.form-control, .form-select { font-size: 16px; min-height: 46px; border-color: var(--pmti-border); border-radius: 10px; }
.form-control:focus, .form-select:focus { border-color: var(--pmti-primary-2); box-shadow: 0 0 0 .2rem rgba(27,58,92,.12); }

/* Buttons: subtle depth + lift on hover */
.btn { border-radius: 10px; font-weight: 600; transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.btn-lg { padding: .8rem 1.7rem; }
.btn-pmti { background: var(--pmti-primary); color: #fff; border: none; padding: .72rem 1.5rem; box-shadow: 0 6px 16px rgba(27,58,92,.20); }
.btn-pmti:hover { background: var(--pmti-primary-dark); color: #fff; transform: translateY(-2px); box-shadow: 0 12px 26px rgba(27,58,92,.28); }
.btn-pmti-outline { background: transparent; color: var(--pmti-primary); border: 2px solid var(--pmti-primary); padding: .62rem 1.4rem; }
.btn-pmti-outline:hover { background: var(--pmti-primary); color: #fff; transform: translateY(-2px); }
.btn-orange { background: linear-gradient(135deg, var(--pmti-accent-2) 0%, var(--pmti-accent) 55%, var(--pmti-accent-dark) 100%); color: #fff; border: none; padding: .72rem 1.5rem; box-shadow: 0 8px 18px rgba(226,102,31,.30); }
.btn-orange:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 14px 30px rgba(226,102,31,.40); filter: saturate(1.05); }
.btn-light:hover { transform: translateY(-2px); }

/* Top bar + navbar */
.pmti-topbar { background: var(--pmti-primary-dark); color: #dbe4ee; font-size: .85rem; }
.pmti-topbar a { color: #dbe4ee; }
.navbar-pmti { background: rgba(255,255,255,.92); backdrop-filter: saturate(1.4) blur(8px); border-bottom: 3px solid var(--pmti-accent); box-shadow: 0 4px 18px rgba(23,32,51,.07); }
.navbar-pmti .navbar-brand { font-family: 'Poppins', sans-serif; font-weight: 700; color: var(--pmti-primary); }
.navbar-pmti .navbar-brand img.brand-full { height: 52px; width: auto; }
.navbar-pmti .navbar-brand img.brand-icon { height: 46px; width: auto; }
.navbar-pmti .nav-link { color: var(--pmti-ink); font-weight: 500; padding: .55rem .9rem; border-radius: 8px; position: relative; }
.navbar-pmti .nav-link:hover, .navbar-pmti .nav-link.active { color: var(--pmti-primary); background: var(--pmti-surface); }
.navbar-pmti .nav-link.active::after { content: ''; position: absolute; left: .9rem; right: .9rem; bottom: .2rem; height: 2px; border-radius: 2px; background: var(--pmti-accent); }

/* Eyebrow label (small uppercase kicker above a heading) */
.eyebrow { display: inline-flex; align-items: center; gap: .5rem; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: #a5480f; margin-bottom: .5rem; }
.eyebrow.on-dark { color: #f2ad7e; }
.eyebrow::before { content: ''; width: 26px; height: 2px; background: currentColor; opacity: .8; }
/* Centered eyebrow sits on its own line above the heading */
.eyebrow.justify-content-center { display: flex; justify-content: center; width: 100%; }
.eyebrow.justify-content-center::before { display: none; }

/* Section helpers */
.section-tint { background: var(--pmti-tint); }
.section-dots { position: relative; }
.section-dots::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(27,58,92,.07) 1.4px, transparent 1.4px);
  background-size: 22px 22px;
  mask-image: linear-gradient(180deg, #000, transparent 65%);
}
.section-dots > .container { position: relative; z-index: 1; }

/* Hero */
.pmti-hero { background: linear-gradient(140deg, #10233a 0%, var(--pmti-primary-dark) 45%, var(--pmti-primary) 100%); color: #fff; padding: 96px 0 88px; position: relative; overflow: hidden; }
.pmti-hero::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 82% 22%, rgba(226,102,31,.22) 0%, transparent 52%), radial-gradient(circle at 6% 92%, rgba(45,90,140,.40) 0%, transparent 46%); pointer-events: none; }
.pmti-hero::before { content: ''; position: absolute; inset: 0; opacity: .55; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 46px 46px; mask-image: linear-gradient(120deg, #000 0%, transparent 70%); }
.pmti-hero h1 { color: #fff; font-size: clamp(2.05rem, 4.7vw, 3.3rem); line-height: 1.1; }
.pmti-hero h1 .accent { color: var(--pmti-accent); }
.pmti-hero .lead { color: #d3deea; max-width: 620px; font-size: 1.13rem; }
.pmti-hero .badge-strip .badge { background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.22); font-weight: 500; padding: .5em .85em; }

/* Hero credential panel */
.hero-panel { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.16); border-radius: var(--radius-lg); padding: 1.4rem 1.5rem; box-shadow: 0 28px 64px rgba(0,0,0,.32); }
.hero-panel .cred { display: flex; align-items: center; gap: .9rem; padding: .72rem 0; }
.hero-panel .cred + .cred { border-top: 1px solid rgba(255,255,255,.11); }
.hero-panel .cred .ic { width: 46px; height: 46px; flex: 0 0 46px; border-radius: 13px; background: linear-gradient(135deg, rgba(226,102,31,.30), rgba(226,102,31,.14)); color: #f7bd94; display: flex; align-items: center; justify-content: center; font-size: 1.3rem; }
.hero-panel .cred .t { color: #fff; font-weight: 600; line-height: 1.15; }
.hero-panel .cred .s { color: #aebccd; font-size: .82rem; }

/* Accreditation / trust strip */
.trust-strip { background: #fff; border-bottom: 1px solid var(--pmti-border); box-shadow: var(--shadow-sm); }
.trust-strip .item { color: var(--pmti-muted); font-size: .92rem; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: .55rem; padding: .4rem 0; }
.trust-strip .item i { color: var(--pmti-accent); font-size: 1.25rem; }

/* Stats strip */
.pmti-stats { background: linear-gradient(120deg, var(--pmti-primary-dark), var(--pmti-primary) 60%, var(--pmti-primary-2)); color: #fff; position: relative; overflow: hidden; }
.pmti-stats::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 90% 10%, rgba(226,102,31,.16), transparent 45%); pointer-events: none; }
.pmti-stats .container { position: relative; z-index: 1; }
.pmti-stats .stat-n { font-family: 'Poppins', sans-serif; font-size: 2.3rem; font-weight: 700; color: #fff; line-height: 1; }
.pmti-stats .stat-l { color: #b9c6d4; font-size: .88rem; margin-top: .3rem; }
.pmti-stats .col-6 { position: relative; }
.pmti-stats .col-6:not(:last-child)::after { content: ''; position: absolute; right: 0; top: 18%; height: 64%; width: 1px; background: rgba(255,255,255,.15); }

/* Section headings */
.section-title { position: relative; padding-bottom: .65rem; margin-bottom: 1.6rem; font-size: clamp(1.55rem, 2.7vw, 2.05rem); }
.section-title::after { content: ''; position: absolute; left: 0; bottom: 0; width: 58px; height: 4px; border-radius: 3px; background: linear-gradient(90deg, var(--pmti-accent), var(--pmti-accent-dark)); }
.section-title.text-center::after { left: 50%; transform: translateX(-50%); }
.section-lead { color: var(--pmti-muted); max-width: 640px; }

/* Generic elevated card + hover lift */
.course-card, .feature, .form-card { will-change: transform; }
.hover-lift { transition: transform .2s ease, box-shadow .2s ease; }
.hover-lift:hover { transform: translateY(-6px); box-shadow: var(--shadow-hover); }

/* Feature cards (why choose us) */
.feature { background: #fff; border: 1px solid var(--pmti-border); border-radius: var(--radius); padding: 1.8rem 1.55rem; height: 100%; box-shadow: var(--shadow-sm); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.feature:hover { transform: translateY(-6px); box-shadow: var(--shadow-hover); border-color: transparent; }
.feature .fic { width: 58px; height: 58px; border-radius: 16px; background: linear-gradient(135deg, var(--pmti-primary), var(--pmti-primary-2)); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.55rem; margin-bottom: 1.05rem; box-shadow: 0 10px 22px rgba(27,58,92,.26); transition: transform .25s ease; }
.feature:hover .fic { transform: translateY(-2px) scale(1.05) rotate(-3deg); }
.feature h5 { margin-bottom: .5rem; }
.feature p { color: var(--pmti-muted); font-size: .94rem; margin-bottom: 0; }

/* School cards with an icon chip */
.school-card { display: flex; align-items: center; gap: .95rem; }
.school-card .chip { width: 50px; height: 50px; flex: 0 0 50px; border-radius: 14px; background: linear-gradient(135deg, var(--pmti-surface), #e7edf5); color: var(--pmti-primary); display: flex; align-items: center; justify-content: center; font-size: 1.4rem; transition: background .2s ease, color .2s ease, transform .2s ease; box-shadow: inset 0 0 0 1px rgba(27,58,92,.05); }
.school-card:hover .chip { background: linear-gradient(135deg, var(--pmti-primary), var(--pmti-primary-2)); color: #fff; transform: scale(1.06); box-shadow: 0 8px 18px rgba(27,58,92,.24); }

/* Course cards */
.course-card { background: #fff; border: 1px solid var(--pmti-border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); position: relative; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; height: 100%; }
.course-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--pmti-accent), var(--pmti-accent-dark)); transform: scaleX(0); transform-origin: left; transition: transform .28s ease; z-index: 2; }
.course-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-hover); border-color: transparent; }
.course-card:hover::before { transform: scaleX(1); }
.course-card .card-top { background: linear-gradient(180deg, #f8fafd, var(--pmti-surface)); padding: .7rem 1.1rem; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--pmti-border); }
.course-card h5 a { color: var(--pmti-primary); transition: color .15s; }
.course-card:hover h5 a { color: var(--pmti-accent-dark); }
.badge-body { background: var(--pmti-primary); color: #fff; font-weight: 600; }
.badge-body.internal { background: var(--pmti-accent); }
.badge-type { background: #fff; border: 1px solid var(--pmti-border); color: var(--pmti-muted); font-weight: 600; }
.course-meta { color: var(--pmti-muted); font-size: .88rem; display: flex; gap: 14px; flex-wrap: wrap; }
.course-meta i { color: var(--pmti-accent); }

/* Testimonial card */
.testimonial { background: #fff; border: 1px solid var(--pmti-border); border-radius: var(--radius); padding: 1.7rem 1.6rem 1.4rem; height: 100%; box-shadow: var(--shadow-sm); position: relative; transition: transform .2s ease, box-shadow .2s ease; }
.testimonial:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.testimonial .quote-mark { font-family: Georgia, serif; font-size: 3.4rem; line-height: .6; color: rgba(226,102,31,.28); height: 1.4rem; }
.testimonial p { color: #3a4a5c; font-style: italic; }
.testimonial .avatar { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; }
.testimonial .avatar-fallback { width: 46px; height: 46px; border-radius: 50%; background: linear-gradient(135deg, var(--pmti-primary), var(--pmti-primary-2)); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; }

/* Workshop rows */
.workshop-row { background: #fff; border: 1px solid var(--pmti-border); border-left: 5px solid var(--pmti-accent); border-radius: var(--radius); box-shadow: var(--shadow-sm); transition: transform .18s ease, box-shadow .18s ease; }
.workshop-row:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.workshop-date { background: linear-gradient(160deg, var(--pmti-primary), var(--pmti-primary-2)); color: #fff; border-radius: 12px; min-width: 76px; box-shadow: 0 8px 18px rgba(27,58,92,.24); }
.workshop-date .d { font-family: 'Poppins', sans-serif; font-size: 1.55rem; font-weight: 700; line-height: 1; }
.workshop-date .m { font-size: .78rem; letter-spacing: 1px; text-transform: uppercase; }

/* CTA band */
.pmti-cta { background: linear-gradient(120deg, var(--pmti-accent) 0%, var(--pmti-accent-dark) 100%); color: #fff; border-radius: var(--radius-lg); position: relative; overflow: hidden; box-shadow: 0 20px 44px rgba(226,102,31,.28); }
.pmti-cta::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 88% 120%, rgba(255,255,255,.22), transparent 45%), radial-gradient(circle at 0% -20%, rgba(0,0,0,.12), transparent 40%); pointer-events: none; }
.pmti-cta > * { position: relative; z-index: 1; }
.pmti-cta h3 { color: #fff; }

/* Footer */
.pmti-footer { background: var(--pmti-primary-dark); color: #b9c6d4; position: relative; }
.pmti-footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--pmti-accent), transparent 70%); }
.pmti-footer h6 { color: #fff; font-size: .95rem; margin-bottom: 1rem; letter-spacing: .02em; }
.pmti-footer a { color: #b9c6d4; }
.pmti-footer a:hover { color: #fff; padding-left: 3px; }
.pmti-footer .footer-bottom { border-top: 1px solid rgba(255,255,255,.12); color: #8fa1b3; font-size: .85rem; }

/* WhatsApp float */
.wa-float { position: fixed; right: 18px; bottom: 18px; z-index: 1030; width: 56px; height: 56px; border-radius: 50%; background: #25d366; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.65rem; box-shadow: 0 10px 26px rgba(37,211,102,.42); transition: transform .18s ease, box-shadow .18s ease; }
.wa-float:hover { color: #fff; transform: scale(1.08) translateY(-2px); box-shadow: 0 14px 32px rgba(37,211,102,.5); }

/* Forms card */
.form-card { background: #fff; border: 1px solid var(--pmti-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }

/* Crumb / breadcrumb chip */
.crumb { display: inline-flex; gap: .35rem; align-items: center; }

/* Page hero (inner pages) */
.page-hero { background: linear-gradient(135deg, var(--pmti-primary-dark) 0%, var(--pmti-primary) 100%); color: #fff; padding: 58px 0; position: relative; overflow: hidden; }
.page-hero::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 88% 25%, rgba(226,102,31,.18) 0%, transparent 52%); pointer-events: none; }
.page-hero::before { content: ''; position: absolute; inset: 0; opacity: .5; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 40px 40px; mask-image: linear-gradient(120deg, #000, transparent 72%); }
.page-hero > .container { position: relative; z-index: 1; }
.page-hero h1 { color: #fff; font-size: clamp(1.7rem, 3.5vw, 2.5rem); }
.page-hero .crumb, .page-hero .crumb a { color: #c6d3e0; font-size: .85rem; }
.page-hero .crumb a:hover { color: #fff; }

/* Responsive tuning */
@media (max-width: 991px) {
  .pmti-hero { padding: 76px 0 64px; }
  .navbar-pmti .navbar-collapse { padding-top: .6rem; }
  .navbar-pmti .nav-link { padding: .6rem .9rem; }
}
@media (max-width: 576px) {
  body { font-size: 15.5px; }
  .pmti-hero { padding: 58px 0 48px; }
  .section-title { font-size: 1.45rem; }
  .feature, .testimonial { padding: 1.4rem 1.25rem; }
  .btn-lg { padding: .72rem 1.35rem; font-size: 1rem; }
  .pmti-cta { text-align: center; }
  .pmti-stats .stat-n { font-size: 1.9rem; }
}

/* ---------------------------------------------------------------------------
   Accessibility & best-practice polish
   --------------------------------------------------------------------------- */
.skip-link {
  position: absolute; left: -999px; top: 0; z-index: 2000;
  background: var(--pmti-primary); color: #fff; padding: .65rem 1.1rem;
  border-radius: 0 0 10px 0; font-weight: 600;
}
.skip-link:focus { left: 0; color: #fff; text-decoration: none; }

a:focus-visible, .btn:focus-visible, .nav-link:focus-visible,
.form-control:focus-visible, .form-select:focus-visible, button:focus-visible {
  outline: 3px solid var(--pmti-accent);
  outline-offset: 2px;
  box-shadow: none;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .course-card:hover, .feature:hover, .wa-float:hover, .workshop-row:hover, .testimonial:hover { transform: none; }
}