/* ===========================================================================
   sgc-theme.css — new home page design, built on the existing stack
   ---------------------------------------------------------------------------
   Load AFTER every existing theme stylesheet:

     <link href="…/css/style-main.css?ver=8.2"          rel="stylesheet">
     <link href="…/css/responsive.css?ver=1.4"          rel="stylesheet">
     <link href="…/css/colors/theme-skin-color-set-1.css?ver=1.1" rel="stylesheet">
     <link href="…/css/sgc-theme.css?ver=1"             rel="stylesheet">   <-- last

   Every rule is scoped to `body.sgc-home` and every new class is prefixed
   `sgc-`, so this file cannot affect any other page on the site and the old
   theme cannot leak into this one. Add class="sgc-home" to <body> on the
   home page only.
   =========================================================================== */

body.sgc-home{
  /* ---- palette ---- */
  --red:        #9c1c1f;
  --red-dark:   #841518;
  --red-deep:   #7a1216;
  --navy:       #12305a;
  --navy-deep:  #0d2440;
  --ink:        #3b4553;
  --muted:      #6f7b8a;
  --line:       #e4e7eb;
  --line-soft:  #eef0f3;

  --serif: 'Lora', Georgia, 'Times New Roman', serif;
  --sans:  'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --hand:  'Caveat', cursive;

  background:#fff;
  color:var(--ink);
  font-family:var(--sans);
  font-size:15px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

/* Bootstrap 3 and style-main.css both set heading fonts and colours — reset
   them inside the page rather than fighting each rule individually. */
body.sgc-home h1,body.sgc-home h2,body.sgc-home h3,
body.sgc-home h4,body.sgc-home h5{
  font-family:var(--serif);color:var(--navy);font-weight:500;
  line-height:1.2;margin:0;letter-spacing:normal;
}
body.sgc-home p{margin:0}
body.sgc-home a{color:inherit;text-decoration:none}
body.sgc-home a:hover,body.sgc-home a:focus{text-decoration:none;color:inherit}
body.sgc-home img{max-width:100%;display:block}
body.sgc-home ul{margin:0;padding:0;list-style:none}
body.sgc-home button{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer}
body.sgc-home .container{max-width:1180px}
body.sgc-home :focus-visible{outline:2px solid var(--red);outline-offset:3px}

/* shared bits ------------------------------------------------------------- */
.sgc-home .sgc-eyebrow{
  display:flex;align-items:center;gap:14px;margin:0 0 20px;
  font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--red);
}
.sgc-home .sgc-eyebrow:after{content:"";width:44px;height:1.5px;background:var(--red)}

.sgc-home .sgc-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.sgc-home .sgc-head h2{
  font-family:var(--serif);font-size:15px;font-weight:500;letter-spacing:.03em;
  text-transform:uppercase;color:var(--navy);display:flex;align-items:center;gap:9px;white-space:nowrap;
}
.sgc-home .sgc-head h2 .fa{color:var(--red);font-size:16px}
.sgc-home .sgc-head h2 .sgc-dash{width:40px;height:1.5px;background:var(--red);display:inline-block}

.sgc-home .sgc-more{font-size:11.5px;font-weight:600;color:var(--red);white-space:nowrap}
.sgc-home .sgc-more .fa{margin-left:5px;transition:transform .2s}
.sgc-home .sgc-more:hover{color:var(--red-dark)}
.sgc-home .sgc-more:hover .fa{transform:translateX(3px)}

/* buttons — .btn is Bootstrap's, so these are additive modifiers only */
.sgc-home .btn.sgc-btn{
  font-family:var(--sans);font-size:13px;font-weight:600;
  padding:13px 22px;border-radius:6px;border:0;
  transition:background .18s,color .18s,border-color .18s,transform .18s;
}
.sgc-home .btn.sgc-btn .fa{margin-left:9px;transition:transform .2s}
.sgc-home .btn.sgc-btn:hover .fa{transform:translateX(3px)}
.sgc-home .btn.sgc-btn-red{background:var(--red);color:#fff;box-shadow:0 8px 20px rgba(156,28,31,.28)}
.sgc-home .btn.sgc-btn-red:hover,.sgc-home .btn.sgc-btn-red:focus{background:var(--red-dark);color:#fff;transform:translateY(-1px)}
.sgc-home .btn.sgc-btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.7)}
.sgc-home .btn.sgc-btn-ghost:hover,.sgc-home .btn.sgc-btn-ghost:focus{background:#fff;color:var(--navy);border-color:#fff}

/* ===========================================================================
   TOP STRIP
   =========================================================================== */
.sgc-home .sgc-topbar{background:var(--red-deep);color:rgba(255,255,255,.9);font-size:11.5px;position:relative;z-index:1002}
.sgc-home .sgc-topbar .container{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:38px}
.sgc-home .sgc-announce{display:flex;align-items:center;gap:11px;white-space:nowrap}
.sgc-home .sgc-announce .sgc-pulse{width:6px;height:6px;border-radius:50%;background:#ff9b7a;flex:none;animation:sgcPulse 1.9s ease-in-out infinite}
.sgc-home .sgc-announce b{color:#fff;font-weight:600}
.sgc-home .sgc-announce a{color:#fff;font-weight:600;border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:1px}
.sgc-home .sgc-announce a:hover{color:#fff;border-color:#fff}
@keyframes sgcPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}

.sgc-home .sgc-access{display:flex;align-items:center}
.sgc-home .sgc-access .sgc-hair{width:1px;height:15px;background:rgba(255,255,255,.24);margin:0 12px}
.sgc-home .sgc-call{display:inline-flex;align-items:center;gap:7px}
.sgc-home .sgc-call a:hover{color:#fff}

/* Bootstrap dropdowns, restyled */
.sgc-home .sgc-access .dropdown-toggle{
  display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:6px;
  font-size:11.5px;font-weight:600;color:#fff;transition:background .15s;
}
.sgc-home .sgc-access .dropdown-toggle:hover,
.sgc-home .sgc-access .open>.dropdown-toggle{background:rgba(255,255,255,.13);color:#fff}
.sgc-home .sgc-access .dropdown-toggle.sgc-outline{border:1px solid rgba(255,255,255,.32)}
.sgc-home .sgc-access .dropdown-toggle .fa-angle-down{transition:transform .2s}
.sgc-home .sgc-access .open>.dropdown-toggle .fa-angle-down{transform:rotate(180deg)}
.sgc-home .sgc-access .dropdown-menu{
  left:auto;right:0;min-width:212px;margin-top:8px;padding:7px;
  background:#fff;border:1px solid var(--line);border-top:2px solid var(--red);
  border-radius:0 0 12px 12px;box-shadow:0 16px 34px rgba(14,41,71,.2);
}
.sgc-home .sgc-access .dropdown-menu>li>a{
  padding:8px 11px;font-size:12.5px;color:var(--ink);border-radius:6px;white-space:nowrap;
}
.sgc-home .sgc-access .dropdown-menu>li>a:hover{background:#f8f2f2;color:var(--red)}

.sgc-home .sgc-social{display:flex;align-items:center;gap:15px}
.sgc-home .sgc-social a{opacity:.85;color:#fff}
.sgc-home .sgc-social a:hover{opacity:1;color:#fff}

/* search row */
.sgc-home .sgc-searchbar{background:#fff;border-bottom:1px solid var(--line);max-height:0;overflow:hidden;transition:max-height .26s ease}
.sgc-home .sgc-searchbar.sgc-open{max-height:80px}
.sgc-home .sgc-searchbar form{display:flex;align-items:center;gap:12px;padding:14px 0;margin:0}
.sgc-home .sgc-searchbar .fa{color:var(--muted);font-size:17px}
.sgc-home .sgc-searchbar input{flex:1;border:0;box-shadow:none;font-size:15px;color:var(--navy);background:none;padding:4px 0;height:auto}
.sgc-home .sgc-searchbar input:focus{outline:none;box-shadow:none}
.sgc-home .sgc-searchbar .sgc-close{color:var(--muted);padding:6px}
.sgc-home .sgc-searchbar .sgc-close:hover{color:var(--red)}

/* ===========================================================================
   HEADER — logo only + menuzord nav, restyled
   =========================================================================== */
.sgc-home .sgc-masthead{background:#fff;border-bottom:1px solid var(--line);position:relative;z-index:1001}
.sgc-home .sgc-masthead .container{display:flex;align-items:center;gap:16px;min-height:88px}
.sgc-home .sgc-brand{flex:none}
.sgc-home .sgc-brand img{height:64px;width:auto;max-width:290px;object-fit:contain}

/* Nav is self-contained: it does not depend on menuzord's CSS or JS, so this
   page does not need menuzord-boxed.css. Markup keeps to plain <ul>/<li>. */
.sgc-home .sgc-nav{margin-left:auto;display:flex;align-items:center}
.sgc-home .sgc-nav>li{position:relative;display:block}
.sgc-home .sgc-nav>li>a{
  display:flex;align-items:center;gap:5px;white-space:nowrap;position:relative;
  font-family:var(--sans);font-size:12.5px;font-weight:500;color:var(--navy);padding:33px 8px;
}
.sgc-home .sgc-nav>li>a:hover{color:var(--red)}
.sgc-home .sgc-nav>li>a .fa-angle-down{opacity:.55;font-size:11px;transition:transform .2s}
.sgc-home .sgc-nav>li:hover>a .fa-angle-down,
.sgc-home .sgc-nav>li.sgc-open>a .fa-angle-down{transform:rotate(180deg)}
.sgc-home .sgc-nav>li.sgc-current>a{color:var(--red)}
.sgc-home .sgc-nav>li.sgc-current>a:after{
  content:"";position:absolute;left:8px;right:8px;bottom:26px;height:2px;background:var(--red);
}
.sgc-home .sgc-sub{
  position:absolute;top:100%;left:0;min-width:250px;z-index:1010;
  background:#fff;border:1px solid var(--line);border-top:2px solid var(--red);
  border-radius:0 0 12px 12px;box-shadow:0 14px 34px rgba(14,41,71,.14);padding:8px;
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .16s,transform .16s,visibility .16s;
}
.sgc-home .sgc-nav>li:hover>.sgc-sub,
.sgc-home .sgc-nav>li:focus-within>.sgc-sub{opacity:1;visibility:visible;transform:none}
.sgc-home .sgc-sub a{display:block;padding:8px 12px;font-size:12.5px;color:var(--ink);border-radius:6px}
.sgc-home .sgc-sub a:hover{background:#f8f2f2;color:var(--red)}
.sgc-home .sgc-nav>li:nth-last-child(-n+3) .sgc-sub{left:auto;right:0}

.sgc-home .sgc-burger{display:none;margin-left:auto;padding:10px;color:var(--navy);font-size:22px}

.sgc-home .sgc-searchbtn{
  flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  color:var(--navy);font-size:18px;transition:background .15s,color .15s;
}
.sgc-home .sgc-searchbtn:hover{background:#f5f6f8;color:var(--red)}

/* ===========================================================================
   NEWS TICKER  (replaces <marquee>)
   =========================================================================== */
.sgc-home .sgc-ticker{background:#faf7f7;border-bottom:1px solid var(--line);overflow:hidden}
.sgc-home .sgc-ticker .container{display:flex;align-items:stretch;padding-right:0}
.sgc-home .sgc-ticker-tag{
  flex:none;display:inline-flex;align-items:center;gap:9px;background:var(--red);color:#fff;
  padding:0 20px 0 24px;min-height:46px;font-size:10.5px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;white-space:nowrap;
  -webkit-clip-path:polygon(0 0,100% 0,calc(100% - 11px) 100%,0 100%);
          clip-path:polygon(0 0,100% 0,calc(100% - 11px) 100%,0 100%);
}
.sgc-home .sgc-ticker-tag .sgc-pulse{width:6px;height:6px;border-radius:50%;background:#ffd0bd;animation:sgcPulse 1.9s ease-in-out infinite}
.sgc-home .sgc-ticker-view{
  flex:1;min-width:0;overflow:hidden;display:flex;align-items:center;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22px,#000 calc(100% - 34px),transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 22px,#000 calc(100% - 34px),transparent 100%);
}
.sgc-home .sgc-ticker-track{display:flex;align-items:center;white-space:nowrap;animation:sgcScroll 46s linear infinite}
.sgc-home .sgc-ticker-view:hover .sgc-ticker-track,
.sgc-home .sgc-ticker.sgc-paused .sgc-ticker-track{animation-play-state:paused}
@keyframes sgcScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.sgc-home .sgc-ticker-track li{display:inline-flex;align-items:center}
.sgc-home .sgc-ticker-track a{position:relative;display:inline-flex;align-items:baseline;gap:9px;padding:0 24px 0 30px;font-size:13px;color:var(--ink)}
.sgc-home .sgc-ticker-track a:before{content:"";position:absolute;left:12px;top:calc(50% - 2.5px);width:5px;height:5px;border-radius:50%;background:var(--red);opacity:.55}
.sgc-home .sgc-ticker-track a:hover{color:var(--red)}
.sgc-home .sgc-ticker-track time{font-size:11px;color:var(--muted)}
.sgc-home .sgc-ticker-toggle{flex:none;width:40px;display:grid;place-items:center;color:var(--muted);border-left:1px solid var(--line)}
.sgc-home .sgc-ticker-toggle:hover{color:var(--red);background:#fff}

/* ===========================================================================
   HERO SLIDER  (replaces Slider Revolution)
   =========================================================================== */
.sgc-home .sgc-hero{position:relative;background:var(--navy-deep);color:#fff;overflow:hidden;
  display:flex;flex-direction:column;justify-content:center}
.sgc-home .sgc-hero>.container{width:100%}
.sgc-home .sgc-frames{position:absolute;top:0;right:0;bottom:0;left:0}
.sgc-home .sgc-frame{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .85s ease}
.sgc-home .sgc-frame.sgc-on{opacity:1}
/* The slide always fills the hero edge to edge. Hero height tracks the
   viewport width (see the wide-screen steps below) so its shape stays close
   to a banner's and the crop stays shallow at every size. */
.sgc-home .sgc-frame img{width:100%;height:100%;object-fit:cover;object-position:center 45%}
.sgc-home .sgc-scrim{
  position:absolute;top:0;right:0;bottom:0;left:0;
  background:
    linear-gradient(95deg, rgba(6,20,38,.90) 0%, rgba(6,20,38,.84) 30%, rgba(6,20,38,.58) 46%, rgba(6,20,38,.18) 64%, rgba(6,20,38,0) 80%),
    linear-gradient(0deg, rgba(6,20,38,.60) 0%, rgba(6,20,38,.30) 14%, rgba(6,20,38,0) 32%);
}
.sgc-home .sgc-hero .container{position:relative;padding-top:62px;padding-bottom:120px}

.sgc-home .sgc-slides{position:relative;min-height:330px;max-width:640px}
.sgc-home .sgc-slide{position:absolute;top:0;left:0;width:100%;opacity:0;visibility:hidden}
/* used only while JS measures the tallest slide */
.sgc-home .sgc-slide.sgc-measure{display:block}
.sgc-home .sgc-slide.sgc-on{opacity:1;visibility:visible;animation:sgcRise .5s ease both}
@keyframes sgcRise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.sgc-home .sgc-kicker{font-size:11px;letter-spacing:.3em;text-transform:uppercase;font-weight:500;color:rgba(255,255,255,.88);margin-bottom:20px;text-shadow:0 1px 10px rgba(4,16,32,.5)}
.sgc-home .sgc-slide h1{font-size:44px;line-height:1.1;color:#fff;font-weight:500;letter-spacing:-.015em;max-width:17ch;text-shadow:0 2px 18px rgba(4,16,32,.45)}
.sgc-home .sgc-tag{font-family:var(--serif);font-size:21px;line-height:1.34;margin-top:16px;color:#fff;text-shadow:0 2px 14px rgba(4,16,32,.5)}
.sgc-home .sgc-tag span{display:block}
.sgc-home .sgc-slide .sgc-lead{margin-top:15px;font-size:15px;line-height:1.68;color:rgba(255,255,255,.86);max-width:46ch;text-shadow:0 1px 12px rgba(4,16,32,.5)}
.sgc-home .sgc-actions{margin-top:26px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.sgc-home .sgc-link-alt{font-size:13px;font-weight:600;color:#fff;padding-bottom:3px;border-bottom:1.5px solid rgba(255,255,255,.42)}
.sgc-home .sgc-link-alt:hover{color:#fff;border-color:var(--red)}

.sgc-home .sgc-bar{
  margin-top:34px;padding-top:20px;border-top:1px solid rgba(255,255,255,.22);
  display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;
}
.sgc-home .sgc-facts{display:flex;gap:28px;flex-wrap:wrap;font-size:12.5px;color:rgba(255,255,255,.9);text-shadow:0 1px 10px rgba(4,16,32,.55)}
.sgc-home .sgc-facts span{display:inline-flex;align-items:center;gap:9px}
.sgc-home .sgc-facts .fa{opacity:.85}
.sgc-home .sgc-slidenav{display:flex;align-items:center;gap:16px}
.sgc-home .sgc-slidenav button{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.3);display:grid;place-items:center;color:#fff;transition:background .18s,border-color .18s}
.sgc-home .sgc-slidenav button:hover{background:var(--red);border-color:var(--red)}
.sgc-home .sgc-count{font-family:var(--serif);font-size:13px;color:rgba(255,255,255,.65)}
.sgc-home .sgc-count b{color:#fff;font-size:17px;font-weight:600}
.sgc-home .sgc-track{width:150px;height:2px;background:rgba(255,255,255,.22);border-radius:2px;overflow:hidden}
.sgc-home .sgc-track i{display:block;height:100%;width:0;background:var(--red)}
.sgc-home .sgc-track i.sgc-run{animation:sgcFill 7s linear forwards}
.sgc-home .sgc-hero.sgc-paused .sgc-track i{animation-play-state:paused}
@keyframes sgcFill{from{width:0}to{width:100%}}

/* NAAC credential */
.sgc-home .sgc-naac{
  position:absolute;right:15px;top:62px;display:flex;align-items:center;gap:14px;
  background:#fff;color:var(--navy);border-radius:10px;padding:13px 16px;
  box-shadow:0 14px 34px rgba(0,0,0,.26);transition:transform .18s;
}
.sgc-home .sgc-naac:hover{transform:translateY(-2px)}
.sgc-home .sgc-naac .sgc-grade{
  position:relative;font-family:var(--serif);font-size:32px;font-weight:600;color:var(--red);
  line-height:1;letter-spacing:-.02em;padding:0 19px;flex:none;
}
.sgc-home .sgc-naac .sgc-grade:before,.sgc-home .sgc-naac .sgc-grade:after{
  content:"";position:absolute;top:-3px;width:14px;height:34px;background:no-repeat center/contain;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 40' fill='none' stroke='%23c9a227' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M13 1c-4 5-8 12-8 20s3 14 8 18'/%3E%3Cpath d='M12 6c-3 1-5 3-6 5M11 13c-3 1-5 3-6 5M10 20c-3 1-4 3-5 6M11 27c-3 1-4 3-4 6'/%3E%3C/svg%3E");
}
.sgc-home .sgc-naac .sgc-grade:before{left:0}
.sgc-home .sgc-naac .sgc-grade:after{right:0;transform:scaleX(-1)}
.sgc-home .sgc-naac b{display:block;white-space:nowrap;font-family:var(--serif);font-size:14px;font-weight:600;color:var(--navy);letter-spacing:.03em}
.sgc-home .sgc-naac small{display:block;font-size:11px;color:var(--muted);margin-top:3px;line-height:1.4}

/* ===========================================================================
   QUICK LINKS — 8 across. Bootstrap 3 has no 8-column unit, so this one row
   uses flex. Everything else on the page uses the normal .col-* grid.
   =========================================================================== */
.sgc-home .sgc-quick{position:relative;z-index:5;margin-top:-72px}
.sgc-home .sgc-quick-card{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 20px 50px rgba(10,28,51,.18);display:flex;overflow:hidden;
}
.sgc-home .sgc-quick-item{
  flex:1 1 0;min-width:0;padding:26px 10px 22px;text-align:center;
  border-right:1px solid var(--line-soft);transition:background .18s;
}
.sgc-home .sgc-quick-item:last-child{border-right:0}
.sgc-home .sgc-quick-item:hover{background:#fbf7f7}
.sgc-home .sgc-quick-item .fa{color:var(--red);font-size:26px;display:block;margin-bottom:12px}
.sgc-home .sgc-quick-item h3{font-family:var(--sans);font-size:12.5px;font-weight:700;color:var(--navy);margin-bottom:4px}
.sgc-home .sgc-quick-item p{font-size:11px;color:var(--muted);line-height:1.45}

/* ===========================================================================
   ABOUT + HAPPENINGS + ACHIEVEMENTS   (col-md-6 / col-md-3 / col-md-3)
   =========================================================================== */
.sgc-home .sgc-trio{padding:42px 0 44px}
.sgc-home .sgc-trio .sgc-col{border-left:1px solid var(--line);padding-left:26px}
.sgc-home .sgc-trio .sgc-col .sgc-head h2{font-size:14px;gap:8px}
.sgc-home .sgc-trio .sgc-col .sgc-head h2 .fa{font-size:15px}
.sgc-home .sgc-trio .sgc-col .sgc-more{font-size:11px}

/* Happenings: its own full-width row across the top, three across.
   Same markup as the Achievements feed — only the CSS differs, so one PHP
   partial can render both. Here the thumbnail goes above the text and spans
   the whole column, which gives the section the weight it deserves. */
/* flex row so the three cards share a height and their footers line up,
   whether a headline runs to one line or three */
.sgc-home .sgc-newsrow{margin-top:20px;display:flex;flex-wrap:wrap}
.sgc-home .sgc-newscol{display:flex}
.sgc-home .sgc-newsrow .sgc-item{display:flex;flex-direction:row;gap:14px;width:100%;padding:0;border-bottom:0}
.sgc-home .sgc-newsrow .sgc-item>div:not(.sgc-thumb){flex:1 1 auto;min-width:0}
.sgc-home .sgc-newsrow .sgc-item .sgc-more{margin-top:9px}
/* Event posters are portrait, so the box is portrait (about 4:5, the common
   poster/social ratio). object-position keeps the crop near the top, where a
   poster carries its title; landscape photos centre-crop acceptably. */
.sgc-home .sgc-newsrow .sgc-thumb{flex:none;width:120px;height:160px;margin-bottom:0;background:#eef1f4}
.sgc-home .sgc-newsrow .sgc-thumb img{object-position:center 18%}
.sgc-home .sgc-newsrow .sgc-thumb img{transition:transform .45s ease}
.sgc-home .sgc-newsrow .sgc-item:hover .sgc-thumb img{transform:scale(1.04)}
.sgc-home .sgc-newsrow .sgc-item h3{font-size:14px;line-height:1.36}
.sgc-home .sgc-newsrow .sgc-stamp{margin-top:7px}
.sgc-home .sgc-newsrow .sgc-item .sgc-more{font-size:11.5px}
.sgc-home .sgc-trio>.container>.sgc-head h2{font-size:16px}
.sgc-home .sgc-trio-rule{border:0;border-top:1px solid var(--line);margin:30px 0}
.sgc-home .sgc-about h2{font-size:26px;line-height:1.24;margin-bottom:16px}
.sgc-home .sgc-about p{font-size:13px;line-height:1.7;color:var(--ink)}
.sgc-home .sgc-about .btn{margin-top:22px;padding:11px 20px;font-size:12.5px}
.sgc-home .sgc-figure{position:relative;padding-bottom:64px;max-width:218px;margin-left:auto}
.sgc-home .sgc-blob{
  width:100%;overflow:hidden;border-radius:44% 8% 8% 44% / 40% 8% 8% 52%;
  background:linear-gradient(160deg,#dfe6ee,#c9d4e0);
}
.sgc-home .sgc-blob img{width:100%;height:262px;object-fit:cover}
.sgc-home .sgc-script{
  position:absolute;left:-6px;bottom:0;transform:rotate(-7deg);
  font-family:var(--hand);font-size:21px;font-weight:600;color:var(--navy);line-height:1.05;
}
.sgc-home .sgc-script i{display:block;font-style:normal}
.sgc-home .sgc-script .sgc-stroke{display:block;width:118px;height:2.5px;background:var(--red);border-radius:3px;margin-top:6px;transform:rotate(-2deg)}

.sgc-home .sgc-feed{margin-top:20px}
.sgc-home .sgc-item{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--line-soft)}
.sgc-home .sgc-item:first-child{padding-top:0}
.sgc-home .sgc-item:last-child{border-bottom:0;padding-bottom:0}
.sgc-home .sgc-thumb{width:92px;height:118px;flex:none;border-radius:6px;overflow:hidden;background:#eef1f4}
.sgc-home .sgc-thumb img{width:100%;height:100%;object-fit:cover;object-position:center 18%}
.sgc-home .sgc-item h3{font-family:var(--serif);font-size:13px;font-weight:500;line-height:1.35;color:var(--navy)}
.sgc-home .sgc-item h3 a:hover{color:var(--red)}
.sgc-home .sgc-stamp{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--muted);margin-top:5px}
.sgc-home .sgc-stamp .fa{color:var(--red);opacity:.8}
.sgc-home .sgc-item .sgc-more{display:block;margin-top:6px}

/* ===========================================================================
   IMPACT
   =========================================================================== */
.sgc-home .sgc-impact{position:relative;background:var(--navy-deep);color:#fff;overflow:hidden;padding:34px 0}
.sgc-home .sgc-impact-bg{position:absolute;top:0;right:0;bottom:0;left:0}
.sgc-home .sgc-impact-bg img{width:100%;height:100%;object-fit:cover;opacity:.22}
.sgc-home .sgc-impact-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(13,36,64,.96) 0%,rgba(13,36,64,.88) 60%,rgba(13,36,64,.55) 100%)}
.sgc-home .sgc-impact .container{position:relative;z-index:2}
.sgc-home .sgc-impact .sgc-eyebrow{color:#fff}
.sgc-home .sgc-stats{display:flex}
.sgc-home .sgc-stat{flex:1 1 0;min-width:0;text-align:center;padding:0 10px;border-right:1px solid rgba(255,255,255,.14)}
.sgc-home .sgc-stat:last-child{border-right:0}
.sgc-home .sgc-stat .fa{font-size:24px;display:block;margin-bottom:10px;color:#fff}
.sgc-home .sgc-stat .sgc-n{display:block;font-family:var(--sans);font-size:26px;font-weight:600;line-height:1;color:#fff;margin:0}
.sgc-home .sgc-stat .sgc-l{display:block;font-size:11.5px;color:rgba(255,255,255,.8);margin-top:7px}
.sgc-home .sgc-quote p{font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.38;color:#fff}
.sgc-home .sgc-quote .sgc-stroke{display:block;width:58px;height:3px;background:var(--red);margin-top:12px;border-radius:3px;transform:rotate(-4deg)}

/* ===========================================================================
   CAMPUS LIFE
   =========================================================================== */
.sgc-home .sgc-campus{padding:36px 0 44px;background:#fff}
.sgc-home .sgc-campus .sgc-head{margin-bottom:20px}
.sgc-home .sgc-campus .row{margin-left:-6px;margin-right:-6px}
.sgc-home .sgc-campus [class*="col-"]{padding-left:6px;padding-right:6px}
.sgc-home .sgc-tile{display:block;height:132px;border-radius:6px;overflow:hidden;background:linear-gradient(135deg,#e8edf3,#dfe6ee)}
.sgc-home .sgc-tile img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease}
.sgc-home .sgc-tile:hover img{transform:scale(1.05)}
.sgc-home .sgc-tile-red{background:var(--red);color:#fff;display:flex;align-items:center;padding:22px;font-family:var(--serif);font-size:21px;line-height:1.28}

/* ===========================================================================
   FOOTER
   =========================================================================== */
.sgc-home .sgc-footer{position:relative;background:var(--navy-deep);color:rgba(255,255,255,.76)}
.sgc-home .sgc-footer-top{padding:44px 0 36px}
.sgc-home .sgc-plate{display:inline-block;background:#fff;padding:12px 16px;border-radius:10px}
.sgc-home .sgc-plate img{height:62px;width:auto;max-width:230px;object-fit:contain}
.sgc-home .sgc-estd{margin-top:14px;font-size:12.5px;line-height:1.6;color:rgba(255,255,255,.6)}
.sgc-home .sgc-fhead{font-family:var(--serif);font-size:15px;color:#fff;font-weight:500;margin-bottom:16px}
.sgc-home .sgc-fcol{border-left:1px solid rgba(255,255,255,.1);padding-left:24px}
.sgc-home .sgc-fcontact li{display:flex;gap:11px;margin-bottom:14px;font-size:12.5px;line-height:1.55}
.sgc-home .sgc-fcontact .fa{color:rgba(255,255,255,.55);margin-top:3px;width:14px;text-align:center}
.sgc-home .sgc-fcontact a:hover{color:#fff}
.sgc-home .sgc-flinks li{margin-bottom:8px}
.sgc-home .sgc-flinks a{font-size:12.5px;display:inline-flex;align-items:center;gap:8px;transition:color .16s,transform .16s}
.sgc-home .sgc-flinks a .fa{color:rgba(255,255,255,.45);font-size:11px}
.sgc-home .sgc-flinks a:hover{color:#fff;transform:translateX(2px)}
.sgc-home .sgc-fsocial{display:flex;gap:7px}
.sgc-home .sgc-fsocial a{width:31px;height:31px;border-radius:50%;border:1px solid rgba(255,255,255,.25);display:grid;place-items:center;color:rgba(255,255,255,.85);transition:background .18s,border-color .18s}
.sgc-home .sgc-fsocial a:hover{background:var(--red);border-color:var(--red);color:#fff}
.sgc-home .sgc-fbar{border-top:1px solid rgba(255,255,255,.1)}
.sgc-home .sgc-fbar .container{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:15px;padding-bottom:15px;font-size:11.5px;color:rgba(255,255,255,.55)}
.sgc-home .sgc-fbar nav a,.sgc-home .sgc-fbar nav span{padding:0 10px;border-left:1px solid rgba(255,255,255,.18)}
.sgc-home .sgc-fbar nav a:first-child{border-left:0}
.sgc-home .sgc-fbar nav a:hover{color:#fff}

/* existing theme's scrollToTop, restyled */
.sgc-home a.scrollToTop{
  /* position lives here rather than in style-main.css, so the button is
     correct on pages that no longer load the old theme stylesheet */
  position:fixed;right:26px;bottom:26px;z-index:90;
  width:42px;height:42px;border-radius:50%;background:var(--red);color:#fff;
  line-height:42px;text-align:center;box-shadow:0 10px 26px rgba(156,28,31,.4);border:0;
}
.sgc-home a.scrollToTop:hover{background:var(--red-dark);color:#fff}

/* ===========================================================================
   RESPONSIVE — Bootstrap 3 breakpoints (1200 / 992 / 768)
   =========================================================================== */
@media (max-width:1199px){
  .sgc-home .sgc-newsrow .sgc-thumb{width:104px;height:139px}
  .sgc-home .sgc-slides{max-width:600px}

  /* Bootstrap's .container is 1170px only at >=1200px; below that it drops to
     970px, too narrow for nine nav items plus the logo. Burger from here down. */
  .sgc-home .sgc-masthead .container{min-height:72px;position:relative;flex-wrap:wrap}
  .sgc-home .sgc-burger{display:block}
  .sgc-home .sgc-searchbtn{margin-left:0}
  .sgc-home .sgc-nav{
    position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid var(--line);
    box-shadow:0 18px 36px rgba(14,41,71,.16);flex-direction:column;align-items:stretch;
    max-height:0;overflow:hidden;transition:max-height .3s ease;z-index:1010;margin:0;
  }
  .sgc-home .sgc-nav.sgc-open{max-height:80vh;overflow-y:auto}
  .sgc-home .sgc-nav>li>a{padding:14px 24px;justify-content:space-between;border-bottom:1px solid var(--line-soft)}
  .sgc-home .sgc-nav>li.sgc-current>a:after{display:none}
  .sgc-home .sgc-sub{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;
    border-radius:0;background:#fafbfc;display:none;padding:6px 12px 12px;min-width:0;
  }
  .sgc-home .sgc-nav>li.sgc-open>.sgc-sub{display:block}
  .sgc-home .sgc-nav>li:hover>.sgc-sub,
  .sgc-home .sgc-nav>li:focus-within>.sgc-sub{opacity:1;visibility:visible;display:none}
  .sgc-home .sgc-nav>li.sgc-open:hover>.sgc-sub{display:block}
}

/* below the lg grid: menuzord switches to its mobile mode at 900px, so the
   header rules here match that, not Bootstrap's 992px */
@media (max-width:991px){

  .sgc-home .sgc-scrim{
    background:
      linear-gradient(100deg, rgba(6,20,38,.88) 0%, rgba(6,20,38,.78) 55%, rgba(6,20,38,.66) 100%),
      linear-gradient(0deg, rgba(6,20,38,.74) 0%, rgba(6,20,38,0) 44%);
  }
  .sgc-home .sgc-hero .container{padding-top:44px;padding-bottom:116px}
  /* text spans the full width here, so centre the art behind it */
  .sgc-home .sgc-naac{position:static;display:inline-flex;margin-bottom:26px}
  .sgc-home .sgc-slides{max-width:none;min-height:340px}
  .sgc-home .sgc-slide h1{font-size:36px;max-width:20ch}

  .sgc-home .sgc-quick-card{flex-wrap:wrap}
  .sgc-home .sgc-quick-item{flex:1 1 25%;border-bottom:1px solid var(--line-soft)}
  .sgc-home .sgc-quick-item:nth-child(4n){border-right:0}
  .sgc-home .sgc-quick-item:nth-last-child(-n+4){border-bottom:0}

  .sgc-home .sgc-trio .sgc-col{border-left:0;padding-left:15px;border-top:1px solid var(--line);padding-top:30px;margin-top:30px}
  .sgc-home .sgc-newsrow .sgc-thumb{width:86px;height:115px}
  .sgc-home .sgc-stats{flex-wrap:wrap}
  .sgc-home .sgc-stat{flex:1 1 33.333%;margin-bottom:24px}
  .sgc-home .sgc-stat:nth-child(3n){border-right:0}
  .sgc-home .sgc-quote{margin-top:10px}
  .sgc-home .sgc-fcol{border-left:0;padding-left:15px;margin-top:30px}
}

@media (max-width:767px){
  /* stacked: one card per row, so give the image back some height */
  .sgc-home .sgc-newscol{margin-bottom:26px}
  .sgc-home .sgc-newscol:last-child{margin-bottom:0}
  .sgc-home .sgc-newsrow .sgc-thumb{width:120px;height:160px}
  .sgc-home .sgc-announce b{display:none}
  .sgc-home .sgc-announce .sgc-pulse{display:none}
  .sgc-home .sgc-call,.sgc-home .sgc-social,.sgc-home .sgc-access .sgc-hair{display:none}
  .sgc-home .sgc-topbar .container{gap:8px}
  .sgc-home .sgc-ticker-tag{padding:0 16px 0 20px;font-size:9.5px;letter-spacing:.12em}
  .sgc-home .sgc-ticker-track a{font-size:12.5px;padding:0 18px 0 26px}
  .sgc-home .sgc-brand img{height:48px;max-width:210px}

  .sgc-home .sgc-slide h1{font-size:29px}
  .sgc-home .sgc-tag{font-size:18px}
  .sgc-home .sgc-slides{min-height:400px}
  .sgc-home .sgc-hero .container{padding-bottom:112px}
  .sgc-home .sgc-bar{flex-direction:column;align-items:flex-start;gap:18px}
  .sgc-home .sgc-facts{gap:12px;flex-direction:column}
  .sgc-home .sgc-track{display:none}

  .sgc-home .sgc-quick-item{flex:1 1 50%}
  .sgc-home .sgc-quick-item:nth-child(2n){border-right:0}
  .sgc-home .sgc-quick-item:nth-last-child(-n+2){border-bottom:0}
  .sgc-home .sgc-figure{max-width:240px;margin:8px auto 24px}
  .sgc-home .sgc-stat{flex:1 1 50%}
  .sgc-home .sgc-stat:nth-child(3n){border-right:1px solid rgba(255,255,255,.14)}
  .sgc-home .sgc-stat:nth-child(2n){border-right:0}
  .sgc-home .sgc-fbar .container{justify-content:center;text-align:center}
}

@media (prefers-reduced-motion:reduce){
  .sgc-home *{animation-duration:.01ms !important;transition-duration:.01ms !important}
  .sgc-home .sgc-ticker-track{animation:none;transform:none}
  .sgc-home .sgc-ticker-view{overflow-x:auto}
  .sgc-home .sgc-ticker-toggle{display:none}
}

/* ---------------------------------------------------------------------------
   Wide screens: grow the hero with the viewport so its shape stays near a
   banner's. Constant for a given screen size — it does not change per slide.
   --------------------------------------------------------------------------- */
@media (min-width:1560px){ .sgc-home .sgc-hero{min-height:672px} }
@media (min-width:1760px){ .sgc-home .sgc-hero{min-height:752px} }
@media (min-width:2000px){ .sgc-home .sgc-hero{min-height:840px} }