/* ==========================================================
   Public Premium Styles - CSS3 + Bootstrap 5 enhancements
   ========================================================== */

:root {
    --tt-primary: #1e40af;
    --tt-primary-dark: #1e3a8a;
    --tt-primary-deep: #172554;
    --tt-accent: #f59e0b;
    --tt-accent-dark: #d97706;
    --tt-ink: #0f172a;
    --tt-muted: #64748b;
    --tt-soft: #f8fafc;
    --tt-radius: 14px;
    --tt-shadow-soft: 0 8px 24px rgba(30, 64, 175, 0.08);
    --tt-shadow-hover: 0 18px 40px rgba(30, 64, 175, 0.18);
}

.public-body {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--tt-ink);
    background: #ffffff;
}

/* ---------- Top strip ---------- */
.public-topstrip {
    background: linear-gradient(90deg, var(--tt-primary-deep), var(--tt-primary));
    color: #fff;
}

.public-topstrip a { text-decoration: none; transition: color .2s; }
.public-topstrip a:hover { color: var(--tt-accent) !important; }

/* ---------- Navbar ---------- */
.public-navbar {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
    transition: all .25s ease;
    padding: .6rem 0;
}

.public-navbar.scrolled {
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
    padding: .35rem 0;
}

.public-navbar .brand-logo-img {
    width: 44px; height: 44px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--tt-primary);
    box-shadow: var(--tt-shadow-soft);
}

.public-navbar .brand-name {
    font-weight: 800;
    font-size: 1.05rem;
    color: var(--tt-primary-deep);
    letter-spacing: -.02em;
}

.public-navbar .brand-tag {
    font-size: .72rem;
    color: var(--tt-muted);
    font-weight: 500;
}

.public-navbar .nav-link {
    color: var(--tt-ink);
    font-weight: 600;
    font-size: .93rem;
    padding: .55rem .9rem !important;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    position: relative;
    transition: all .2s ease;
}

.public-navbar .nav-link i { font-size: 1.05rem; color: var(--tt-primary); }

.public-navbar .nav-link:hover {
    color: var(--tt-primary);
    background: rgba(30, 64, 175, 0.06);
}

.public-navbar .nav-link.active {
    color: var(--tt-primary-deep);
    background: linear-gradient(135deg, rgba(30, 64, 175, 0.10), rgba(245, 158, 11, 0.10));
}

.public-navbar .nav-link.active::after {
    content: '';
    position: absolute;
    left: 20%; right: 20%;
    bottom: 2px;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--tt-primary), var(--tt-accent));
}

/* Premium CTA */
.btn-premium-cta {
    background: linear-gradient(135deg, var(--tt-accent), var(--tt-accent-dark));
    color: #1a1a1a !important;
    font-weight: 700;
    border: none;
    padding: .55rem 1.1rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    box-shadow: 0 8px 20px rgba(245, 158, 11, 0.35);
    transition: all .25s ease;
    position: relative;
    overflow: hidden;
}

.btn-premium-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 26px rgba(245, 158, 11, 0.45);
    color: #1a1a1a !important;
}

.btn-premium-cta::before {
    content: '';
    position: absolute; top: 0; left: -80%;
    width: 60%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255,255,255,.55), transparent);
    transform: skewX(-20deg);
    transition: left .6s ease;
}

.btn-premium-cta:hover::before { left: 130%; }

/* Ghost / outline premium buttons */
.btn-premium-outline {
    background: transparent;
    color: var(--tt-primary-deep);
    border: 2px solid var(--tt-primary);
    font-weight: 700;
    border-radius: 999px;
    padding: .55rem 1.2rem;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    transition: all .25s ease;
}
.btn-premium-outline:hover {
    background: var(--tt-primary);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: var(--tt-shadow-hover);
}

/* ---------- Public main ---------- */
.public-main { min-height: 60vh; }

/* ---------- Section titles ---------- */
.section-eyebrow {
    display: inline-block;
    color: var(--tt-primary);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: .12em;
    font-size: .78rem;
    background: rgba(30, 64, 175, 0.08);
    padding: .3rem .8rem;
    border-radius: 999px;
    margin-bottom: .75rem;
}

.section-title {
    font-weight: 800;
    color: var(--tt-primary-deep);
    letter-spacing: -.02em;
}

.section-subtitle { color: var(--tt-muted); }

/* ---------- Hero ---------- */
.premium-hero {
    position: relative;
    background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 45%, #2563eb 100%);
    color: #fff;
    padding: 5rem 0 6rem;
    overflow: hidden;
    isolation: isolate;
}

.premium-hero::before,
.premium-hero::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: .35;
    z-index: -1;
}
.premium-hero::before {
    width: 380px; height: 380px;
    background: #f59e0b;
    top: -80px; right: -80px;
}
.premium-hero::after {
    width: 320px; height: 320px;
    background: #38bdf8;
    bottom: -100px; left: -60px;
}

.premium-hero h1 {
    font-weight: 800;
    font-size: clamp(2rem, 4.2vw, 3.4rem);
    letter-spacing: -.03em;
    line-height: 1.1;
}

.premium-hero .hero-lead {
    font-size: 1.1rem;
    color: rgba(255,255,255,0.85);
    max-width: 560px;
}

/* ---------- Page hero (inner pages) ---------- */
.page-hero {
    background: linear-gradient(135deg, var(--tt-primary-deep), var(--tt-primary));
    color: #fff;
    padding: 3.5rem 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.page-hero h1 { font-weight: 800; letter-spacing: -.02em; }
.page-hero .lead { color: rgba(255,255,255,0.85); }

/* ---------- Premium cards ---------- */
.premium-card {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.06);
    border-radius: var(--tt-radius);
    box-shadow: var(--tt-shadow-soft);
    transition: transform .25s ease, box-shadow .25s ease;
    overflow: hidden;
}
.premium-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--tt-shadow-hover);
}

.premium-card .card-icon {
    width: 52px; height: 52px;
    border-radius: 14px;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, rgba(30,64,175,.12), rgba(245,158,11,.15));
    color: var(--tt-primary);
    font-size: 1.6rem;
    margin-bottom: .8rem;
}

/* ---------- Premium form controls ---------- */
.form-control, .form-select, .input-group-text {
    border-radius: 10px;
    border: 1.5px solid #e2e8f0;
    padding: .45rem .7rem;
    font-size: .9rem;
    line-height: 1.4;
    min-height: 40px;
    transition: border-color .2s, box-shadow .2s;
}
textarea.form-control { min-height: 90px; }
.form-control:focus, .form-select:focus {
    border-color: var(--tt-primary);
    box-shadow: 0 0 0 3px rgba(30, 64, 175, 0.12);
}
.form-control::placeholder { color: #94a3b8; font-weight: 400; font-size: .88rem; }

.form-label {
    font-weight: 600;
    color: var(--tt-ink);
    font-size: .82rem;
    margin-bottom: .35rem;
    letter-spacing: .01em;
}
.form-label i { font-size: .95rem; color: var(--tt-primary); margin-right: .2rem; }

/* Compact form variant */
.form-control-sm, .form-select-sm { font-size: .82rem; padding: .35rem .55rem; min-height: 34px; }

/* Section headings inside forms */
.form-section-title { font-size: 1.05rem; font-weight: 700; color: var(--tt-primary-deep); }
.form-section-sub { font-size: .82rem; color: var(--tt-muted); }

/* ---------- Fee card ---------- */
.fee-card {
    border-radius: var(--tt-radius);
    padding: 1.25rem;
    background: linear-gradient(135deg, #ffffff, #f8fafc);
    border: 1px solid rgba(15,23,42,.06);
    transition: all .25s;
}
.fee-card:hover { transform: translateY(-3px); box-shadow: var(--tt-shadow-hover); }
.fee-card .fee-amount { font-size: 1.6rem; font-weight: 800; color: var(--tt-primary-deep); }
.fee-card .fee-term { color: var(--tt-muted); font-size: .85rem; }

/* ---------- Announcement chip ---------- */
.announce-chip {
    display: inline-flex; align-items: center; gap: .4rem;
    background: linear-gradient(135deg, #fef3c7, #fde68a);
    color: #92400e;
    border-radius: 999px;
    padding: .3rem .8rem;
    font-weight: 700; font-size: .78rem;
    animation: pulseGlow 2.4s ease-in-out infinite;
}
@keyframes pulseGlow {
    0%,100% { box-shadow: 0 0 0 0 rgba(245,158,11,.4); }
    50% { box-shadow: 0 0 0 10px rgba(245,158,11,0); }
}

/* ---------- Footer ---------- */
.public-footer {
    background: linear-gradient(135deg, #0f172a, #1e3a8a);
    color: #fff;
    position: relative;
    margin-top: 4rem;
}
.footer-wave {
    height: 6px;
    background: linear-gradient(90deg, var(--tt-primary), var(--tt-accent), var(--tt-primary));
    background-size: 200% 100%;
    animation: waveMove 6s linear infinite;
}
@keyframes waveMove { 0%{background-position:0 0;} 100%{background-position:200% 0;} }

.footer-logo { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(255,255,255,.3); }
.footer-heading { color: #fff; font-weight: 700; margin-bottom: 1rem; font-size: .95rem; text-transform: uppercase; letter-spacing: .06em; }
.footer-links, .footer-contact { list-style: none; padding: 0; margin: 0; }
.footer-links li, .footer-contact li { margin-bottom: .5rem; }
.footer-links a { color: rgba(255,255,255,.75); text-decoration: none; transition: color .2s, padding .2s; }
.footer-links a:hover { color: var(--tt-accent); padding-left: 4px; }
.footer-contact li { color: rgba(255,255,255,.8); font-size: .9rem; }
.footer-contact li i { color: var(--tt-accent); margin-right: .4rem; }

.credit-link { color: var(--tt-accent); font-weight: 700; text-decoration: none; }
.credit-link:hover { color: #fff; }
.heartbeat { display: inline-block; animation: heartbeat 1.4s ease-in-out infinite; }
@keyframes heartbeat { 0%,100%{transform:scale(1);} 50%{transform:scale(1.25);} }

/* ---------- Utility ---------- */
.rounded-2xl { border-radius: 1.25rem !important; }
.shadow-premium { box-shadow: var(--tt-shadow-soft) !important; }
.bg-soft { background: var(--tt-soft) !important; }

/* Mobile nav */
@media (max-width: 991.98px) {
    .public-navbar .navbar-collapse {
        background: #fff;
        margin-top: .75rem;
        padding: 1rem;
        border-radius: 14px;
        box-shadow: var(--tt-shadow-soft);
    }
    .public-navbar .nav-link.active::after { display: none; }
}

/* =====================================================
   PUBLIC SITE — PREMIUM ADDITIONS
   ===================================================== */

/* Stats band (Why Choose Us) */
.stats-band {
    background: linear-gradient(135deg,#0B32D9 0%,#1F4FFF 100%);
    color:#fff; border-radius: 22px;
    padding: 2.2rem 1.5rem;
    position: relative; overflow: hidden;
    box-shadow: 0 20px 50px rgba(11,50,217,.30);
}
.stats-band::before {
    content:""; position:absolute; inset:0;
    background:
        radial-gradient(circle at 15% 20%, rgba(245,194,26,.22), transparent 45%),
        radial-gradient(circle at 85% 80%, rgba(255,255,255,.15), transparent 45%);
    pointer-events: none;
}
.stats-band .stat-item { text-align:center; padding: 0.5rem; position: relative; }
.stats-band .stat-icon {
    width: 60px; height: 60px; border-radius: 16px;
    background: rgba(255,255,255,.15);
    display: grid; place-items: center;
    font-size: 28px; color: #FFD54A;
    margin: 0 auto 12px;
    backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,.20);
}
.stats-band .stat-number {
    font-size: 2.4rem; font-weight: 800;
    color: #fff; line-height: 1; margin-bottom: 4px;
    text-shadow: 0 4px 14px rgba(0,0,0,.20);
}
.stats-band .stat-label {
    font-size: .85rem; text-transform: uppercase;
    letter-spacing: 1.5px; opacity: .9; font-weight: 600;
}

/* Feature card — premium hover */
.feature-card {
    position: relative; overflow: hidden;
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
    border: 1px solid rgba(15,23,42,.06);
}
.feature-card::before {
    content:""; position:absolute; top:0; left:0; right:0; height:4px;
    background: linear-gradient(90deg, var(--tt-primary,#0B32D9), var(--tt-accent,#F5C21A));
    transform: scaleX(0); transform-origin: left;
    transition: transform .35s ease;
}
.feature-card:hover::before { transform: scaleX(1); }
.feature-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(11,50,217,.15); border-color: transparent; }
.feature-card .fc-ico {
    background: linear-gradient(135deg, #eef2ff, #fef3c7);
    width: 72px; height: 72px; border-radius: 20px;
    display: inline-grid; place-items: center;
    margin-bottom: 1rem;
}

/* Mission / Vision cards — premium */
.mv-card { transition: transform .3s ease, box-shadow .3s ease; overflow: hidden; position: relative; }
.mv-card::after {
    content:""; position:absolute; bottom:-40px; right:-40px;
    width: 140px; height: 140px; border-radius: 50%;
    background: radial-gradient(circle, rgba(11,50,217,.06), transparent 70%);
    pointer-events: none;
}
.mv-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(11,50,217,.15); }
.mv-card .mv-icon { font-size: 26px; }

/* Fee card — premium */
.fee-card {
    position: relative; overflow: hidden;
    padding: 1.6rem 1.4rem;
}
.fee-card::before {
    content:""; position:absolute; top:0; left:0; width:5px; height:100%;
    background: linear-gradient(180deg, var(--tt-primary,#0B32D9), var(--tt-accent,#F5C21A));
}
.fee-card:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(11,50,217,.18); }
.fee-card .fee-amount {
    background: linear-gradient(135deg,#0B32D9,#1F4FFF);
    -webkit-background-clip: text; background-clip: text; color: transparent;
    font-size: 2rem;
}
.fee-card .fee-term {
    display: inline-block; padding: 3px 10px;
    background: #eef2ff; color: #3b5bdb;
    border-radius: 999px; font-weight: 600;
    font-size: .78rem; text-transform: uppercase; letter-spacing: .5px;
}

/* Section titles — premium eyebrow */
.section-eyebrow {
    background: linear-gradient(135deg,#eef2ff,#fef3c7);
    color: #3b5bdb; padding: 6px 16px; border-radius: 999px;
    font-size: .75rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 1.4px;
    display: inline-block;
}
.section-title {
    background: linear-gradient(135deg,#0f172a 0%,#0B32D9 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
    font-weight: 800; letter-spacing: -.02em;
    margin-top: .6rem;
}
.section-subtitle { color:#64748b; max-width: 640px; margin: .5rem auto 0; }

/* Hero — enrich CTA */
.hero { position: relative; overflow: hidden; }
.hero::before {
    content:""; position:absolute; inset:0;
    background:
        radial-gradient(circle at 20% 20%, rgba(245,194,26,.20), transparent 45%),
        radial-gradient(circle at 80% 80%, rgba(255,255,255,.10), transparent 45%);
    pointer-events: none;
}
.hero .btn { border-radius: 12px; font-weight: 700; padding: .75rem 1.5rem; }
.hero .btn-brand-gold {
    box-shadow: 0 10px 24px rgba(245,194,26,.40);
    background: linear-gradient(135deg,#F5C21A,#FFD54A);
    color:#3a2900; border:0;
}
.hero .btn-brand-gold:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(245,194,26,.55); }
.hero .btn-outline-light { border-width: 2px; backdrop-filter: blur(4px); background: rgba(255,255,255,.08); }
.hero .btn-outline-light:hover { background:#fff; color: #0B32D9; }

/* Gallery thumb — polish */
.gallery-thumb { border-radius: 16px; overflow: hidden; }
.gallery-thumb img, .gallery-thumb video { transition: transform .5s ease; }
.gallery-thumb:hover img, .gallery-thumb:hover video { transform: scale(1.08); }

/* Premium CTA buttons on gradient bands */
.btn-premium-cta {
    background: linear-gradient(135deg,#F5C21A,#FFD54A);
    color:#3a2900; border:0; font-weight: 800;
    padding: .8rem 1.8rem; border-radius: 12px;
    box-shadow: 0 12px 26px rgba(245,194,26,.45);
    transition: transform .2s ease, box-shadow .2s ease;
}
.btn-premium-cta:hover { transform: translateY(-2px); box-shadow: 0 18px 32px rgba(245,194,26,.55); color:#3a2900; }
.btn-premium-outline {
    border: 2px solid rgba(255,255,255,.8); background: rgba(255,255,255,.08);
    color:#fff; font-weight: 700; padding: .8rem 1.8rem; border-radius: 12px;
    backdrop-filter: blur(4px);
    transition: all .2s ease;
}
.btn-premium-outline:hover { background:#fff; color:#0B32D9 !important; }

