/* =========================================================
   Syntec University — Editorial / Motion Enhancement Layer
   Adds restrained institutional motion inspired by modern
   higher-education sites while preserving the restored core.
   ========================================================= */

:root{
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-soft:cubic-bezier(.16,1,.3,1);
  --duration:780ms;
  --campus-main:url('../assets/Syntec-University-Main-Entrance.png');
  --campus-students:url('../assets/Syntec-University-Main-Entrance.png');
  --campus-columns:url('https://images.unsplash.com/photo-1763890498955-13f109b2fbd7?auto=format&fit=crop&fm=jpg&q=82&w=2200');
}

body{overflow-x:hidden}

/* Scroll progress */
.scroll-progress{
  position:fixed;left:0;top:0;width:100%;height:3px;z-index:120;
  transform:scaleX(0);transform-origin:left center;
  background:linear-gradient(90deg,var(--gold),#e3c66e);
  pointer-events:none;
}

/* Header refinement */
.site-header{transition:min-height .35s var(--ease-out),box-shadow .35s ease,background-color .35s ease}
.site-header.is-scrolled{box-shadow:0 10px 35px rgba(9,20,24,.09);background:rgba(255,253,247,.94)}
.site-header .nav-shell{transition:min-height .35s var(--ease-out)}
.site-header.is-scrolled .nav-shell{min-height:70px}
.site-header .brand img{transition:width .35s var(--ease-out),height .35s var(--ease-out),transform .4s var(--ease-out)}
.site-header.is-scrolled .brand img{width:150px;height:auto}
.brand:hover img{transform:rotate(-3deg) scale(1.035)}

/* Hero: editorial photography + depth */
.hero{
  min-height:clamp(650px,82vh,900px);
  display:grid;align-items:end;
  background-image:
    linear-gradient(90deg,rgba(8,20,25,.94) 0%,rgba(8,20,25,.82) 38%,rgba(8,20,25,.34) 68%,rgba(8,20,25,.22) 100%),
    var(--campus-main);
  background-size:cover;background-position:center 42%;
  isolation:isolate;
}
.hero::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,20,25,.05),rgba(8,20,25,.28));
}
.hero::after{
  content:"SUMUS IN POSTERUM";position:absolute;right:-.02em;bottom:-.25em;
  font-family:var(--serif);font-size:clamp(5.5rem,13vw,13rem);line-height:1;
  letter-spacing:-.045em;color:rgba(255,255,255,.035);white-space:nowrap;pointer-events:none;
}
.hero .wrap{padding:clamp(5.5rem,10vh,9rem) 0 5rem;grid-template-columns:minmax(0,1.15fr) minmax(260px,.55fr);align-items:end}
.hero-copy{max-width:760px;position:relative;z-index:2}
.hero h1{font-size:clamp(4.1rem,10vw,9rem);line-height:.84;letter-spacing:-.055em;margin:.5rem 0 1.5rem}
.hero p{max-width:650px;font-size:clamp(1rem,1.4vw,1.18rem);color:rgba(255,255,255,.82)}
.hero .eyebrow{display:inline-flex;align-items:center;gap:.7rem}
.hero .eyebrow::before{content:"";width:42px;height:1px;background:#e5ca77}
.hero-crest{filter:drop-shadow(0 22px 36px rgba(0,0,0,.28));transform-origin:center;will-change:transform}
.hero-actions{margin-top:2rem}

.hero-scroll-cue{position:absolute;left:max(1rem,calc((100% - 1180px)/2));bottom:1.25rem;color:#fff;display:flex;align-items:center;gap:.85rem;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;opacity:.68}
.hero-scroll-cue span{width:42px;height:1px;background:currentColor;display:block;position:relative;overflow:hidden}
.hero-scroll-cue span::after{content:"";position:absolute;inset:0;background:#e7cb78;transform:translateX(-100%);animation:scrollCue 2.4s var(--ease-out) infinite}
@keyframes scrollCue{55%,100%{transform:translateX(100%)}}

/* Page heroes receive a restrained photographic wash */
.page-hero{position:relative;overflow:hidden;isolation:isolate;padding:clamp(4.8rem,9vw,8rem) 0}
.page-hero::before{content:"";position:absolute;inset:-12%;z-index:-2;background-image:url('../assets/SYNTEC-University-Faculty-Parking-Lot.png');background-size:cover;background-position:top right;filter:saturate(.45) contrast(1.05);transform:scale(1.04)}
.page-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(13,35,43,.97),rgba(13,35,43,.80) 54%,rgba(13,35,43,.48))}
.page-hero .wrap{position:relative}
.page-hero h1{max-width:900px;line-height:.95;letter-spacing:-.035em}
.page-hero p{font-size:1.08rem;max-width:720px}

/* Scroll reveal primitives */
.reveal{
  opacity:0;transform:translate3d(0,34px,0);
  transition:opacity var(--duration) ease,transform var(--duration) var(--ease-out);
  transition-delay:var(--reveal-delay,0ms);
}
.reveal.reveal-left{transform:translate3d(-42px,18px,0)}
.reveal.reveal-right{transform:translate3d(42px,18px,0)}
.reveal.reveal-scale{transform:scale(.965) translateY(24px)}
.reveal.is-visible{opacity:1;transform:none}

/* Hero load choreography */
.hero-animate{opacity:0;transform:translateY(28px);animation:heroIn 1s var(--ease-out) forwards;animation-delay:var(--hero-delay,0ms)}
@keyframes heroIn{to{opacity:1;transform:none}}

/* Image reveal / parallax containers */
.media-frame{position:relative;overflow:hidden;background:#12252b;min-height:360px}
.media-frame::after{content:"";position:absolute;inset:0;background:var(--ink);transform-origin:right center;transition:transform 1.1s var(--ease-soft);z-index:2}
.media-frame.is-visible::after{transform:scaleX(0)}
.media-frame img,.media-frame .media-bg{width:100%;height:100%;object-fit:cover;position:absolute;inset:-5% 0 auto 0;min-height:110%;will-change:transform;transition:filter .5s ease}
.media-frame:hover img,.media-frame:hover .media-bg{filter:saturate(1.07) contrast(1.02)}
.media-frame .media-bg{background-size:cover;background-position:center}
.media-caption{position:absolute;left:1.3rem;bottom:1.15rem;z-index:3;color:#fff;font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;text-shadow:0 2px 18px rgba(0,0,0,.5)}

/* Editorial sections */
.editorial-feature{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.editorial-feature .feature-copy{padding:1rem 0}
.editorial-feature h2{font-size:clamp(2.4rem,4.5vw,4.7rem);line-height:.98;letter-spacing:-.035em;margin:.55rem 0 1.2rem}
.editorial-feature p{font-family:var(--serif);font-size:1.08rem;color:#48565a;max-width:610px}

.explore-grid{display:grid;grid-template-columns:1.1fr .9fr .9fr;gap:1rem;align-items:stretch}
.explore-tile{position:relative;min-height:430px;overflow:hidden;background:#182b31;color:#fff;isolation:isolate}
.explore-tile:first-child{min-height:520px}
.explore-tile .tile-bg{position:absolute;inset:-5%;background-size:cover;background-position:center;z-index:-2;transition:transform .9s var(--ease-out),filter .6s ease;will-change:transform}
.explore-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,14,18,.08) 25%,rgba(5,14,18,.88) 100%);z-index:-1}
.explore-tile:hover .tile-bg{transform:scale(1.045)}
.explore-tile .tile-copy{position:absolute;left:0;right:0;bottom:0;padding:2rem}
.explore-tile .tile-label{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:#e9cc79;font-weight:700}
.explore-tile h3{font-family:var(--serif);font-size:clamp(1.8rem,3vw,3rem);font-weight:400;line-height:1.02;margin:.45rem 0 .8rem}
.explore-tile p{color:rgba(255,255,255,.78);font-size:.9rem;max-width:420px}
.explore-tile .arrow-link{display:inline-flex;align-items:center;gap:.6rem;text-transform:uppercase;letter-spacing:.12em;font-size:.7rem;font-weight:700;margin-top:.5rem}
.explore-tile .arrow-link::after{content:"→";transition:transform .3s var(--ease-out)}
.explore-tile:hover .arrow-link::after{transform:translateX(7px)}

/* News/events style section */
.news-shell{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,6rem);align-items:start}
.news-intro{position:sticky;top:120px}
.news-intro h2{font-size:clamp(2.6rem,5vw,5rem);line-height:.93;letter-spacing:-.04em;margin:.4rem 0 1rem}
.news-list{border-top:1px solid var(--line)}
.news-item{display:grid;grid-template-columns:110px 1fr auto;gap:1.2rem;align-items:start;padding:1.5rem 0;border-bottom:1px solid var(--line);transition:padding-left .35s var(--ease-out),background .25s ease}
.news-item:hover{padding-left:.85rem}
.news-item time{font-size:.69rem;letter-spacing:.12em;text-transform:uppercase;color:#8a7538;font-weight:700;padding-top:.38rem}
.news-item h3{font-family:var(--serif);font-size:clamp(1.35rem,2vw,1.85rem);font-weight:400;line-height:1.15;margin:0 0 .35rem}
.news-item p{margin:0;color:#667176;font-size:.88rem}
.news-item .news-arrow{font-size:1.25rem;padding-top:.15rem;transition:transform .3s var(--ease-out)}
.news-item:hover .news-arrow{transform:translateX(6px)}

/* Cards / content feel more editorial */
.card,.staff-card,.course,.letter,.contact-card,.book-cover{transition:transform .45s var(--ease-out),box-shadow .45s ease,border-color .35s ease}
.card:hover,.staff-card:hover,.course:hover{transform:translateY(-7px);box-shadow:0 22px 50px rgba(17,30,35,.11);border-color:#c8bd9b}
.card{position:relative;overflow:hidden}
.card::before{content:"";position:absolute;left:0;top:0;width:3px;height:0;background:var(--gold);transition:height .45s var(--ease-out)}
.card:hover::before{height:100%}
.card-link::after{content:" →";display:inline-block;transition:transform .3s var(--ease-out)}
.card:hover .card-link::after{transform:translateX(5px)}

.stats{position:relative;z-index:3}
.stat strong{display:block;font-variant-numeric:tabular-nums}
.stat{transition:background .3s ease}
.stat:hover{background:rgba(255,255,255,.04)}

.quote-strip{position:relative;overflow:hidden}
.quote-strip::before{content:'“';position:absolute;left:2vw;top:-.38em;font-family:var(--serif);font-size:16rem;color:rgba(255,255,255,.04);line-height:1}

/* Button polish */
.btn,.nav-cta{position:relative;overflow:hidden;isolation:isolate}
.btn::before,.nav-cta::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,.13);transform:translateX(-110%) skewX(-16deg);transition:transform .55s var(--ease-out);z-index:-1}
.btn:hover::before,.nav-cta:hover::before{transform:translateX(0) skewX(0)}

/* Chat launcher has a quiet pulse */
.chat-launch::after{content:"";position:absolute;inset:-5px;border:1px solid rgba(189,155,72,.45);border-radius:50%;animation:quietPulse 3.2s ease-out infinite}
@keyframes quietPulse{0%,35%{transform:scale(.86);opacity:0}55%{opacity:.6}100%{transform:scale(1.35);opacity:0}}

/* Footer crest movement */
.footer-brand img{transition:transform .7s var(--ease-out),filter .4s ease}
.footer-brand:hover img{transform:rotate(-5deg) scale(1.05);filter:brightness(1.12)}

/* Responsive */
@media(max-width:960px){
  .site-header.is-scrolled .main-nav{top:70px}
  .editorial-feature,.news-shell{grid-template-columns:1fr}
  .news-intro{position:static}
  .explore-grid{grid-template-columns:1fr 1fr}
  .explore-tile:first-child{grid-column:1/-1;min-height:460px}
  .hero .wrap{grid-template-columns:1fr;padding-top:5rem}
  .hero-crest{justify-self:end;max-width:230px;margin-top:-7rem;opacity:.8}
}
@media(max-width:620px){
  .hero{min-height:690px;background-position:63% center}
  .hero::after{font-size:5rem;bottom:.2em}
  .hero .wrap{padding:5.3rem 0 4rem}
  .hero h1{font-size:clamp(4rem,19vw,6rem)}
  .hero-crest{display:none}
  .hero-scroll-cue{display:none}
  .explore-grid{grid-template-columns:1fr}
  .explore-tile,.explore-tile:first-child{grid-column:auto;min-height:390px}
  .news-item{grid-template-columns:1fr auto;gap:.8rem}
  .news-item time{grid-column:1/-1}
  .page-hero{padding:4.4rem 0}
}

/* Accessibility: preserve the visual design without forced motion. */
@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}
  .reveal,.hero-animate{opacity:1!important;transform:none!important}
  .media-frame::after{transform:scaleX(0)!important}
}

/* =========================================================
   SIRE
   Syntec Information & Response Engine
   ========================================================= */

.sire-chat {
  --sire-bg: #0d1c22;
  --sire-bg-soft: #14282f;
  --sire-panel: #f6f3ec;
  --sire-border: rgba(255,255,255,.13);
  --sire-text: #26363c;
  --sire-muted: #6d777a;
  --sire-gold: #c69c52;
  --sire-gold-light: #e1c181;
  --sire-red: #9f3434;
  --sire-warning: #c57333;
  --sire-green: #6daf83;

  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 10000;

  font-family:
    Helvetica,
    Arial,
    sans-serif;
}


.sire-launcher {
  position: relative;

  display: flex;
  align-items: center;
  gap: 10px;

  min-height: 54px;

  padding:
    8px
    18px
    8px
    8px;

  border: 1px solid
    rgba(255,255,255,.12);

  border-radius: 100px;

  background:
    var(--sire-bg);

  color: #fff;

  cursor: pointer;

  box-shadow:
    0 14px 40px
    rgba(0,0,0,.22);

  transition:
    transform .2s ease,
    box-shadow .2s ease;
}


.sire-launcher:hover {
  transform:
    translateY(-2px);

  box-shadow:
    0 18px 45px
    rgba(0,0,0,.3);
}


.sire-launcher-mark,
.sire-mark {
  display: grid;
  place-items: center;

  flex-shrink: 0;

  width: 38px;
  height: 38px;



  color:
    var(--sire-gold-light);

  font-family:
    Georgia,
    serif;

  font-size:
    20px;

  font-weight:
    700;
}


.sire-launcher-text {
  font-size: 13px;

  font-weight: 700;

  letter-spacing:
    .15em;
}


.sire-launcher-status {
  position: absolute;

  right: 7px;
  top: 7px;

  width: 8px;
  height: 8px;

  border-radius:
    50%;

  background:
    var(--sire-green);

  box-shadow:
    0 0 0 3px
    rgba(109,175,131,.15);
}


.sire-panel {
  position: absolute;

  right: 0;
  bottom: 68px;

  width:
    min(
      390px,
      calc(100vw - 30px)
    );

  height:
    min(
      620px,
      calc(100vh - 110px)
    );

  overflow: hidden;

  border:
    1px solid
    rgba(0,0,0,.12);

  border-radius:
    10px;

  background:
    var(--sire-panel);

  box-shadow:
    0 24px 70px
    rgba(0,0,0,.32);

  display: flex;
  flex-direction: column;

  animation:
    sirePanelIn
    .25s
    ease;
}


.sire-panel[hidden] {
  display: none !important;
}


@keyframes sirePanelIn {

  from {
    opacity: 0;

    transform:
      translateY(10px)
      scale(.98);
  }

  to {
    opacity: 1;

    transform:
      translateY(0)
      scale(1);
  }

}


.sire-header {
  min-height: 70px;

  padding:
    12px
    14px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  background:
    var(--sire-bg);

  color: #fff;
}


.sire-identity {
  display: flex;
  align-items: center;
  gap: 11px;
}


.sire-mark {
  width: 42px;
  height: 42px;
}


.sire-identity strong {
  display: block;

  margin-bottom:
    3px;

  font-size:
    15px;

  letter-spacing:
    .16em;
}


.sire-identity span {
  display: block;

  max-width:
    210px;

  color:
    rgba(255,255,255,.62);

  font-size:
    9px;

  line-height:
    1.35;

  letter-spacing:
    .09em;

  text-transform:
    uppercase;
}


.sire-header-actions {
  display: flex;
  align-items: center;
  gap: 2px;
}


.sire-icon-button {
  width: 34px;
  height: 34px;

  border: 0;

  background:
    transparent;

  color:
    rgba(255,255,255,.7);

  font-size:
    21px;

  cursor: pointer;
}


.sire-icon-button:hover {
  color: #fff;
}


.sire-system-bar {
  min-height: 31px;

  padding:
    0 14px;

  display: flex;
  align-items: center;
  gap: 7px;

  border-bottom:
    1px solid
    rgba(0,0,0,.08);

  background:
    #e9e6de;

  color:
    #647075;

  font-size:
    9px;

  letter-spacing:
    .08em;

  text-transform:
    uppercase;
}


.sire-system-light {
  width: 6px;
  height: 6px;

  border-radius:
    50%;

  background:
    var(--sire-green);
}


.sire-messages {
  flex: 1;

  overflow-y: auto;

  padding:
    18px
    15px;

  scroll-behavior:
    smooth;
}


.sire-message {
  max-width:
    86%;

  margin-bottom:
    15px;
}


.sire-message--assistant {
  margin-right:
    auto;
}


.sire-message--user {
  margin-left:
    auto;
}


.sire-message-label {
  margin-bottom:
    4px;

  color:
    var(--sire-muted);

  font-size:
    8px;

  font-weight:
    700;

  letter-spacing:
    .16em;
}


.sire-message--user
.sire-message-label {
  text-align:
    right;
}


.sire-message-text {
  padding:
    10px
    12px;

  border-radius:
    4px;

  background:
    #fff;

  color:
    var(--sire-text);

  font-size:
    13px;

  line-height:
    1.55;

  box-shadow:
    0 2px 9px
    rgba(0,0,0,.06);
}


.sire-message--user
.sire-message-text {
  background:
    var(--sire-bg);

  color:
    #fff;
}


.sire-message--restricted
.sire-message-text {
  border-left:
    3px solid
    var(--sire-gold);

  background:
    #f0ece2;
}


.sire-message--warning
.sire-message-text {
  border-left:
    3px solid
    var(--sire-warning);

  background:
    #f4e7db;
}


.sire-message--glitch
.sire-message-text {
  border:
    1px solid
    rgba(159,52,52,.35);

  background:
    #241719;

  color:
    #efc7c7;

  font-family:
    "Courier New",
    monospace;

  letter-spacing:
    .04em;

  animation:
    sireGlitch
    .15s
    linear
    2;
}


@keyframes sireGlitch {

  0% {
    transform:
      translateX(0);
  }

  33% {
    transform:
      translateX(-1px);
  }

  66% {
    transform:
      translateX(1px);
  }

  100% {
    transform:
      translateX(0);
  }

}


.sire-message-links {
  margin-top:
    7px;

  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}


.sire-message-links a {
  display: inline-block;

  padding:
    7px
    9px;

  border:
    1px solid
    rgba(13,28,34,.18);

  border-radius:
    3px;

  color:
    var(--sire-bg);

  font-size:
    10px;

  font-weight:
    700;

  letter-spacing:
    .05em;

  text-decoration:
    none;

  text-transform:
    uppercase;
}


.sire-message-links a:hover {
  background:
    var(--sire-bg);

  color: #fff;
}


.sire-quick-actions {
  padding:
    9px
    12px;

  display: flex;
  gap: 6px;

  overflow-x:
    auto;

  border-top:
    1px solid
    rgba(0,0,0,.06);

  background:
    #efede7;
}


.sire-quick-actions button {
  flex-shrink: 0;

  padding:
    7px 9px;

  border:
    1px solid
    rgba(13,28,34,.16);

  border-radius:
    100px;

  background:
    transparent;

  color:
    var(--sire-text);

  font-size:
    9px;

  cursor: pointer;

  white-space:
    nowrap;
}


.sire-quick-actions button:hover {
  border-color:
    var(--sire-gold);

  background:
    #fff;
}


.sire-form {
  padding:
    11px;

  display: grid;

  grid-template-columns:
    1fr auto;

  gap: 7px;

  border-top:
    1px solid
    rgba(0,0,0,.08);

  background:
    #fff;
}


.sire-form input {
  min-width: 0;

  height: 42px;

  padding:
    0 12px;

  border:
    1px solid
    #cbc8c0;

  border-radius:
    3px;

  outline: none;

  font-family:
    inherit;

  font-size:
    13px;
}


.sire-form input:focus {
  border-color:
    var(--sire-gold);

  box-shadow:
    0 0 0 2px
    rgba(198,156,82,.12);
}


.sire-form button {
  height: 42px;

  padding:
    0 15px;

  border:
    0;

  border-radius:
    3px;

  background:
    var(--sire-bg);

  color:
    #fff;

  font-size:
    10px;

  font-weight:
    700;

  letter-spacing:
    .08em;

  text-transform:
    uppercase;

  cursor: pointer;
}


.sire-form button:hover {
  background:
    #18323b;
}


.sire-footer-label {
  padding:
    6px;

  background:
    var(--sire-bg);

  color:
    rgba(255,255,255,.35);

  font-size:
    7px;

  letter-spacing:
    .18em;

  text-align:
    center;
}


/* Typing */

.sire-typing-dots {
  display: flex;
  align-items: center;
  gap: 4px;

  width: fit-content;

  padding:
    11px 13px;

  border-radius:
    4px;

  background:
    #fff;
}


.sire-typing-dots span {
  width: 5px;
  height: 5px;

  border-radius:
    50%;

  background:
    #778185;

  animation:
    sireTyping
    1s
    infinite;
}


.sire-typing-dots span:nth-child(2) {
  animation-delay:
    .15s;
}


.sire-typing-dots span:nth-child(3) {
  animation-delay:
    .3s;
}


@keyframes sireTyping {

  0%,
  60%,
  100% {

    opacity: .35;

    transform:
      translateY(0);

  }

  30% {

    opacity: 1;

    transform:
      translateY(-3px);

  }

}


/* Security escalation */

.sire-chat[data-security-level="2"]
.sire-system-light {
  background:
    var(--sire-warning);
}


.sire-chat[data-security-level="3"]
.sire-system-light,
.sire-chat[data-security-level="4"]
.sire-system-light {
  background:
    var(--sire-red);

  box-shadow:
    0 0 0 3px
    rgba(159,52,52,.14);
}


.sire-chat[data-security-level="3"]
.sire-system-bar,
.sire-chat[data-security-level="4"]
.sire-system-bar {
  color:
    #823d3d;
}


/* Accessibility */

.sire-visually-hidden {
  position: absolute;

  width: 1px;
  height: 1px;

  padding: 0;
  margin: -1px;

  overflow: hidden;

  clip:
    rect(0,0,0,0);

  white-space:
    nowrap;

  border: 0;
}


/* Mobile */

@media
(max-width: 600px) {

  .sire-chat {
    right: 12px;
    bottom: 12px;
  }


  .sire-panel {
    position: fixed;

    left: 12px;
    right: 12px;
    bottom: 78px;

    width: auto;

    height:
      calc(100vh - 105px);

    max-height:
      700px;
  }

}


/* Reduced motion */

@media
(prefers-reduced-motion: reduce) {

  .sire-panel,
  .sire-message--glitch,
  .sire-typing-dots span {
    animation: none !important;
  }

}