:root{
      --tgs-maroon: #9A1E35;
      --tgs-maroon-dark: #7a1f2b;
      --tgs-navy: #0A1A44;
      --tgs-gold: #d4af37;
      --tgs-bg: #f8f9fc;
      --tgs-text:#1f2933;
      --radius: 12px;
    }

    html,body { height:100%; margin:0; font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color:var(--tgs-text); background:var(--tgs-bg); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
    a { text-decoration:none; color:inherit; }

    .container-tight { max-width:1160px; margin:0 auto; padding-left:1rem; padding-right:1rem; }

    /* Header */
    .site-header { background: #fff; box-shadow: 0 4px 18px rgba(20,20,20,0.04); padding:.5rem 0; position:sticky; top:0; z-index:60; }
    .brand { display:flex; gap:.6rem; align-items:center; text-decoration:none; }
    .brand img { height:48px; display:block; border-radius:8px; object-fit:cover; }

    /* Buttons */
    .btn-tgs { background:var(--tgs-maroon); color:#fff; border:0; font-weight:700;    align-content: center; }
    .btn-tgs-outline { color:var(--tgs-maroon-dark); border:2px solid rgba(122,31,43,0.12); background:#fff; font-weight:700; }

    /* HERO */
    .hero-gest { position:relative; width:100%; overflow:hidden; display:block; background:#000; }
    .hero-gest picture, .hero-gest img.hero-gest__img { width:100%; height:auto; display:block; object-fit:cover; }
    /* limit hero height on small devices for quick content visibility */
    .hero-gest__img { max-height:56vh; width:100%; object-position:35% 40%; }

    .hero-gest__overlay {
      position:absolute; inset:0; pointer-events:none;
      background: linear-gradient(180deg, rgba(10,26,68,0.22), rgba(122,31,43,0.12) 60%, rgba(0,0,0,0.28));
      z-index:1;
    }

    .hero-gest__content {
      position:absolute; left:1rem; bottom:1rem; z-index:2; color:#fff;
      display:flex; flex-direction:column; gap:.45rem; align-items:flex-start;
      width:calc(100% - 2rem); padding:.7rem; backdrop-filter: blur(2px);
      background: linear-gradient(180deg, rgba(0,0,0,0.18), rgba(0,0,0,0.12));
      border-radius:10px;
    }
    .hero-gest__badge { background:rgba(255,255,255,0.06); color:var(--tgs-gold); padding:.3rem .7rem; border-radius:999px; font-weight:800; font-size:.62rem; display:inline-block; letter-spacing:0.3px; }
    .hero-gest__title { margin:0; font-weight:800; line-height:1.05; text-shadow:0 6px 18px rgba(0,0,0,0.45); font-size:clamp(1.05rem, 3.6vw, 2rem); }
    .hero-gest__subtitle { margin:0; font-size:clamp(.8rem, 2.7vw, 1.05rem); color: rgba(255,255,255,0.95); max-width:98%; }

    .hero-gest__actions { display:flex; gap:.6rem; margin-top:.6rem; flex-wrap:wrap; }

    /* Flow bar (horizontal scroll on small screens) */
    .flow-wrap { margin-top:1rem; padding:.8rem; border-radius:14px; background:linear-gradient(90deg, rgba(0,0,0,0.04), rgba(0,0,0,0.02)); display:flex; gap:.5rem; align-items:center; overflow:auto; -webkit-overflow-scrolling:touch; }
    .flow-step { flex:0 0 auto; background:#fff; border-radius:999px; padding:.5rem .85rem; box-shadow:0 6px 18px rgba(10,10,10,0.06); font-weight:700; color:var(--tgs-maroon-dark); white-space:nowrap; font-size:.88rem; }

    /* Compact sections & cards */
    section { padding:1rem 0; }
    .section-title { font-size:24px; font-weight:700; margin:0 0 .5rem 0; color:var(--tgs-maroon-dark); text-align:center;}
    .card-compact { background:#fff; border-radius:12px; padding:.85rem; box-shadow:0 10px 30px rgba(10,10,10,0.04); }
.card{background: #fff;
    border-radius: 12px;
    padding: .85rem;
     box-shadow: 0 10px 10px rgb(10 10 10 / 13%);
    border: none;
}
    .scholarship-table th, .scholarship-table td { font-size:.88rem; padding:.55rem .7rem; vertical-align:middle; }

    footer { margin-top:1.25rem; padding:1rem; background:#9a1e35; color:#fff; border-radius:6px; }

    /* Modal compact */
    .modal-content { border-radius:12px; }
    .form-control, .form-select { height:42px; }

    /* small utility */
    .small-muted { color:#000; font-size:.92rem; }

    /* Badges */
    .bg-tgs { background: var(--tgs-maroon); color:#fff; padding:.45rem .8rem; border-radius:999px; font-weight:700; }
    .bg-dark { background: var(--tgs-maroon-dark); color:#fff; padding:.45rem .8rem; border-radius:999px; font-weight:700; }

    /* responsive grid tweaks */
    @media(min-width:576px){
      .container-tight { padding-left:1.25rem; padding-right:1.25rem; }
      .hero-gest__content { left:1.6rem; bottom:1.6rem; width:60%; padding:1rem; }
    }
    @media(min-width:720px){
      .container-tight { padding-left:2rem; padding-right:2rem; }
      .hero-gest__content { left:3rem; bottom:3rem; width:44%; padding:1.1rem 1.2rem; }
      .hero-gest__title { font-size:2rem; }
      .hero-gest__subtitle { font-size:1.05rem; }
      .hero-gest__img { max-height:520px; object-position:45% 40%; }
      .flow-wrap { padding:1rem; border-radius:18px; }
    }
    @media(min-width:1100px){
      .hero-gest__content { width:36%; left:4rem; bottom:3.5rem; }
      .hero-gest__img { height:520px; }
      .brand img { height:56px; }
    }

    /* accessibility focus */
    a.btn:focus, button:focus, input:focus, select:focus { outline:3px solid rgba(154,30,53,0.12); outline-offset:2px; }

    /* small helpers for better spacing on very small screens */
    @media(max-width:420px){
      .brand img { height:44px; }
      .hero-gest__content { position: relative;padding:.55rem; left:.6rem; bottom:.6rem; width:calc(100% - 1.2rem); }
      .hero-gest__title { font-size:1.05rem; }
      .hero-gest__img { max-height:48vh; object-position:30% 35%; }
    }
	
	
/* Admission Flow: horizontal full-width timeline on desktop; stacked vertical on mobile */
/* ============================================
   ADMISSION FLOW (DESKTOP + MOBILE)
   ============================================ */

/* Full-width background band */
.admission-flow-band {
    width: 99vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background: #9a1e35;
    padding: 40px 0;
}

/* Container inside band */
.admission-flow-wrapper {
    max-width: 1160px;
    margin: auto;
    padding: 0 16px;
}

/* Section heading */
.admission-flow-heading {
    text-align: center;
    font-weight: 800;
    color: #fff;
    margin-bottom: 10px;
    font-size: 1.6rem;
}

.admission-flow-sub {
    text-align: center;
    color: #fff;
    margin-bottom: 40px;
    font-size: 1rem;
}
.btn:hover{
    background: var(--tgs-maroon);
    color: #fff;
}

/* Desktop layout */
.admission-flow-steps {
    display: none;
}

@media (min-width: 992px) {
    .admission-flow-steps {
        display: flex;
        justify-content: space-between;
        position: relative;
    }

    /* Horizontal connecting line */
    .admission-flow-steps::before {
        content: "";
        position: absolute;
        left: 3%;
        right: 3%;
        height: 3px;
        background: linear-gradient(
            90deg,
            #9A1E35 0%,
            #FFCC00 50%,
            #9A1E35 100%
        );
        top: 58px;
        border-radius: 4px;
    }
}

/* Desktop Step */
.af-step {
    text-align: center;
    position: relative;
    width: 14%;
}

.af-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 5px solid #9A1E35;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28px;
    background: #fff;
    margin: auto;
    position: relative;
    z-index: 2;
}

.af-icon.yellow {
    border-color: #FFD200;
}

/* Number badge */
.af-step[data-step]::before {
    content: attr(data-step);
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #9A1E35;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
}

.af-step[data-yellow="true"]::before {
    background: #FFD200;
    color: #7A1F2B;
}

/* Titles & text */
.af-title {
    margin-top: 20px;
    font-weight: 700;
    color: #fff;
    font-size: 1rem;
}

.af-text {
    margin-top: 4px;
    color: #ffd200;
    font-size: 0.85rem;
    max-width: 160px;
    margin-left: auto;
    margin-right: auto;
}

/* -----------------------------------------
   MOBILE VERSION (STACKED DESIGN)
   ----------------------------------------- */
.admission-flow-mobile {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 26px;
}

@media (min-width: 992px) {
    .admission-flow-mobile {
        display: none;
    }
}

.afm-step {
    text-align: center;
}

.afm-icon {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    border: 6px solid #9A1E35;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 32px;
    margin: auto;

	background:#fff;
}

.afm-icon.yellow {
    border-color: #FFD200;
}

.afm-title {
    margin-top: 16px;
    font-weight: 800;
    font-size: 1rem;
    color: #fff;
}

.afm-text {
    margin-top: 6px;
    font-size: 0.9rem;
    color: #ffd200;
}