/* ============================================================
   ADEA Foundation — Students gallery
   Brand red #f22e3b. Montserrat (display) + Poppins (body).

   Red is deliberately restrained: the students' uniforms and shukas
   are already red, so flooding the chrome with brand red competes
   with the photography. Red is reserved for interactive state,
   the story badge, and the closing CTA.

   Everything is scoped under .adea-students to survive the
   Beaver Builder theme's global styles.
   ============================================================ */

.adea-students{
  --red:#f22e3b; --red-deep:#c31f2b; --red-soft:#f2545f;
  --ink:#191614; --ink-soft:#4a4340; --muted:#7c736d;
  --paper:#fbfaf8; --shell:#f4f1ec; --tile:#e9e4dd; --line:#e4ded6;
  --night:#171412;

  /* Palette is restricted to the official site colours: red #f22e3b/#f2545f
     and green #5f6a2d/#4a5423 (both lifted from adeafoundation.org CSS),
     plus warm neutrals. Purple and Blue are group NAMES, not licence to add
     purple or blue ink -- those two groups get neutral accents. */
  --green:#5f6a2d; --green-deep:#4a5423;
  --g-green:#5f6a2d; --g-red:#c31f2b; --g-purple:#55504b; --g-blue:#857e76;

  --display:'Montserrat',system-ui,-apple-system,sans-serif;
  --sans:'Poppins',system-ui,-apple-system,sans-serif;

  --gap:24px; --row:8px;

  /* Explicit px base: bb-theme sets html{font-size:10px} and body 14px, so
     anything relative (rem, inherited sizes) shrinks to ~62% on the live
     site. Every size in this file is px for the same reason -- do not
     reintroduce rem. */
  font-size:16px;
  font-family:var(--sans); color:var(--ink); line-height:1.65;
  background:var(--paper); width:100%; max-width:100%; margin:0;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.adea-students *{box-sizing:border-box}
.adea-students img{max-width:100%;display:block}
.adea-students .wrap{max-width:1240px;margin:0 auto;padding:0 28px}
.adea-students .full{width:100%}
.adea-students :focus-visible{outline:3px solid var(--red);outline-offset:3px}

/* group colour, set per-element via data-group */
.adea-students [data-group="green"]{--gc:var(--g-green)}
.adea-students [data-group="red"]{--gc:var(--g-red)}
.adea-students [data-group="purple"]{--gc:var(--g-purple)}
.adea-students [data-group="blue"]{--gc:var(--g-blue)}

/* ============ HERO ============ */
.adea-students .ag-hero{
  position:relative;isolation:isolate;display:flex;align-items:flex-end;
  min-height:min(82vh,760px);color:#fff;background:var(--night);padding:140px 0 0}
/* The student stands centre-left with the Kilimanjaro snowcap upper-right,
   so the headline lives on the RIGHT over trees and rooftops: a right-weighted
   wash plus a bottom lift, leaving her face and the peak clear. */
.adea-students .ag-hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(0deg,rgba(18,14,12,.72) 0%,rgba(18,14,12,0) 52%),
    linear-gradient(275deg,rgba(18,14,12,.82) 0%,rgba(18,14,12,.55) 34%,rgba(18,14,12,.12) 62%,rgba(18,14,12,0) 100%)}
.adea-students .ag-hero img{
  /* Anchored to the top: the Kilimanjaro snowcap sits at the top edge of the
     photo and is the whole point of using it. */
  position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center top}
.adea-students .ag-hero .wrap{
  width:100%;padding-bottom:86px;
  display:flex;flex-direction:column;align-items:flex-end}
.adea-students .ag-hero .wrap > *{text-align:left}
.adea-students .ag-hero h1{
  font-family:var(--display);font-weight:800;color:#fff;
  font-size:clamp(40px,4.6vw,62.4px);line-height:1.04;letter-spacing:-.025em;
  max-width:13ch;margin:0 0 22px}
.adea-students .ag-hero h1 em{font-style:normal;color:var(--red-soft)}
.adea-students .ag-hero p{max-width:46ch;font-size:17.6px;line-height:1.7;color:#e7e2dd;margin:0}

/* ============ STATS ============ */
.adea-students .ag-stats{background:#fff;border-bottom:1px solid var(--line)}
.adea-students .ag-stats .grid{display:grid;grid-template-columns:repeat(4,1fr)}
.adea-students .ag-stats .cell{padding:46px 34px;border-left:1px solid var(--line)}
.adea-students .ag-stats .cell:first-child{border-left:0;padding-left:0}
.adea-students .ag-stats .num{
  font-family:var(--display);font-weight:800;color:var(--red);
  font-size:clamp(35.2px,3.8vw,49.6px);line-height:1;letter-spacing:-.03em}
.adea-students .ag-stats .lbl{
  margin-top:10px;font-family:var(--display);font-size:12.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
@media (max-width:860px){
  .adea-students .ag-stats .grid{grid-template-columns:1fr 1fr}
  .adea-students .ag-stats .cell{padding:28px 20px}
  .adea-students .ag-stats .cell:nth-child(odd){border-left:0;padding-left:0}
  .adea-students .ag-stats .cell:nth-child(-n+2){border-bottom:1px solid var(--line)}}

/* ============ FILTER BAR ============ */
.adea-students .ag-filters{
  /* --ag-sticky-top is set by the site glue script (mu-plugin) to the fixed
     site header's height so the bar docks below it instead of underneath it.
     Standalone preview has no fixed header, so it falls back to 0. */
  position:sticky;top:var(--ag-sticky-top,0px);z-index:30;background:rgba(251,250,248,.94);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);padding:14px 0}
/* Filters are a desktop affordance: on phones the sticky bar ate too much
   of the small viewport, so it only exists on large screens. */
@media (max-width:1023px){
  .adea-students .ag-filters{display:none}}
.adea-students .ag-filters .wrap{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
/* Must wrap: at 360px an unwrapped row pushed the Blue chip off-screen
   entirely, making one group unreachable. */
.adea-students .ag-fgroup{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.adea-students .ag-fgroup > span{
  font-family:var(--display);font-size:11.5px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);margin-right:2px}
.adea-students .ag-chip{
  font-family:var(--sans);font-size:14px;font-weight:500;color:var(--ink-soft);
  background:transparent;border:1px solid var(--line);border-radius:100px;
  padding:7px 15px;cursor:pointer;transition:all .18s ease;line-height:1;white-space:nowrap}
.adea-students .ag-chip:hover{border-color:var(--muted);color:var(--ink)}
.adea-students .ag-chip[aria-pressed="true"]{
  background:var(--ink);border-color:var(--ink);color:#fff}
.adea-students .ag-chip.is-story[aria-pressed="true"]{
  background:var(--red);border-color:var(--red)}
.adea-students .ag-chip .dot{
  display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--gc,var(--muted));margin-right:7px;vertical-align:middle}
.adea-students .ag-count{
  margin-left:auto;font-size:13.5px;color:var(--muted);white-space:nowrap}
.adea-students .ag-count b{color:var(--ink);font-weight:600}
@media (max-width:860px){
  .adea-students .ag-filters .wrap{gap:14px}
  .adea-students .ag-count{margin-left:0;width:100%}}

/* ============ SECTION HEADS ============ */
.adea-students .ag-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:48px}
.adea-students .ag-head h2{
  font-family:var(--display);font-weight:800;color:var(--ink);letter-spacing:-.02em;
  font-size:clamp(30.4px,3.6vw,44.8px);line-height:1.1;margin:0}
.adea-students .ag-head p{max-width:40ch;font-size:16px;color:var(--muted);margin:0 0 4px}
@media (max-width:860px){
  .adea-students .ag-head{flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:32px}}

/* ============ MASONRY ============ */
.adea-students .ag-stories{background:var(--shell);padding:96px 0 104px;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.adea-students .ag-masonry{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));
  grid-auto-rows:var(--row);column-gap:var(--gap)}
/* JS sets grid-row-end per item; without JS the cards simply stack in
   equal-height cells rather than breaking. */
.adea-students .ag-masonry > .ag-card{padding-bottom:var(--gap)}

/* ============ CARD ============ */
.adea-students .ag-card{margin:0;min-width:0}
.adea-students .ag-card-in{
  background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;
  display:flex;flex-direction:column;width:100%;text-align:left;padding:0;
  font:inherit;color:inherit;cursor:pointer;
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease}
.adea-students .ag-card-in:hover{
  transform:translateY(-5px);border-color:#cfc7bd;
  box-shadow:0 26px 50px -20px rgba(25,22,20,.28)}
.adea-students .ag-photo{
  position:relative;overflow:hidden;background:var(--tile);
  /* aspect-ratio comes from the manifest, inline, so the grid reserves the
     right height before the image loads -- no layout shift. */}
.adea-students .ag-photo img{
  width:100%;height:100%;object-fit:cover;transition:transform .6s ease;
  opacity:0;transition:opacity .5s ease,transform .6s ease}
.adea-students .ag-photo img.is-loaded{opacity:1}
.adea-students .ag-card-in:hover .ag-photo img{transform:scale(1.04)}
.adea-students .ag-badge{
  position:absolute;top:12px;left:12px;z-index:2;display:inline-flex;align-items:center;gap:6px;
  background:var(--red);color:#fff;border-radius:100px;padding:5px 11px;
  font-family:var(--display);font-size:10.5px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase}
.adea-students .ag-body{padding:20px 20px 22px;display:flex;flex-direction:column;flex:1}
.adea-students .ag-tag{
  display:flex;align-items:center;gap:9px;margin-bottom:9px;
  font-family:var(--display);font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gc,var(--muted))}
.adea-students .ag-name{
  font-family:var(--display);font-weight:700;font-size:18.56px;letter-spacing:-.01em;
  line-height:1.25;color:var(--ink);margin:0}
.adea-students .ag-card.is-unknown .ag-name{color:var(--muted);font-style:italic;font-weight:500}
.adea-students .ag-excerpt{
  margin:9px 0 0;font-size:15px;line-height:1.6;color:var(--ink-soft);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.adea-students .ag-more{
  margin-top:14px;font-family:var(--display);font-size:11.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;color:var(--red);
  display:inline-flex;align-items:center;gap:7px}
.adea-students .ag-more::after{content:"→";transition:transform .2s ease}
.adea-students .ag-card-in:hover .ag-more::after{transform:translateX(4px)}

/* filter transitions */
.adea-students .ag-card{transition:opacity .3s ease,transform .3s ease}
.adea-students .ag-card[hidden]{display:none}
.adea-students .ag-card.is-out{opacity:0;transform:scale(.96)}

/* scroll reveal */
.adea-students .ag-card.reveal{opacity:0;transform:translateY(18px)}
.adea-students .ag-card.reveal.is-in{opacity:1;transform:none}

/* ============ YEAR BAND ============ */
.adea-students .ag-year{
  background:var(--night);color:#fff;padding:64px 0;position:relative;overflow:hidden}
.adea-students .ag-year .wrap{display:flex;align-items:center;justify-content:space-between;gap:30px}
.adea-students .ag-year h2{
  font-family:var(--display);font-weight:800;font-size:clamp(54.4px,10vw,112px);
  line-height:.9;letter-spacing:-.04em;margin:0;color:#fff}
.adea-students .ag-year .meta{text-align:right;color:#a89f98;font-size:15px;max-width:30ch}
.adea-students .ag-year .meta strong{
  display:block;font-family:var(--display);color:var(--red-soft);
  font-size:12.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;margin-bottom:8px}
@media (max-width:700px){
  .adea-students .ag-year{padding:44px 0}
  .adea-students .ag-year .wrap{flex-direction:column;align-items:flex-start;gap:14px}
  .adea-students .ag-year .meta{text-align:left}}

/* ============ GROUP BAND ============ */
.adea-students .ag-groupband{padding:52px 0 28px}
.adea-students .ag-groupband .bar{
  display:flex;align-items:center;gap:16px;
  padding-bottom:16px;border-bottom:2px solid var(--gc,var(--line))}
.adea-students .ag-groupband .swatch{
  width:34px;height:34px;border-radius:8px;background:var(--gc);flex:none}
.adea-students .ag-groupband h3{
  font-family:var(--display);font-weight:800;font-size:24px;letter-spacing:-.01em;
  margin:0;color:var(--ink)}
.adea-students .ag-groupband .n{
  margin-left:auto;font-size:14px;color:var(--muted);white-space:nowrap}

/* ============ QUOTE BAND ============ */
.adea-students .ag-quote{
  position:relative;isolation:isolate;color:#fff;padding:132px 0;background:var(--night)}
.adea-students .ag-quote::after{
  content:"";position:absolute;inset:0;z-index:-1;background:rgba(20,16,14,.76)}
/* The quote portraits are 3:4, so a short wide band only ever shows a thin
   horizontal slice of them. 15% lands on the face; lower values slid down to
   the shuka and the band read as a flat dark block. */
.adea-students .ag-quote img{
  position:absolute;inset:0;z-index:-2;width:100%;height:100%;
  object-fit:cover;object-position:center 15%}
/* bb-theme ships Bootstrap blockquote styling (#fcf8e3 background, border,
   italic serif) -- neutralise it before our own quote styling applies. */
.adea-students blockquote{
  background:transparent;border:0;box-shadow:none;font-size:inherit;font-style:normal}
.adea-students .ag-quote blockquote{max-width:900px;margin:0 auto;padding:0 28px;text-align:center}
/* Named ag-qmark, NOT "mark": Bootstrap (shipped by bb-theme) styles
   mark/.mark with a #fcf8e3 highlight background. */
.adea-students .ag-quote .ag-qmark{
  font-family:var(--display);font-size:64px;font-weight:800;color:var(--red-soft);
  line-height:1;display:block;margin-bottom:8px}
.adea-students .ag-quote p{
  font-family:var(--display);font-weight:600;font-style:italic;
  font-size:clamp(23.2px,3.2vw,37.6px);line-height:1.38;color:#fff;margin:0 0 28px;
  letter-spacing:-.015em}
.adea-students .ag-quote cite{
  font-style:normal;font-family:var(--display);font-size:12.5px;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;color:var(--red-soft)}
.adea-students .ag-quote cite span{display:block;color:#a89f98;margin-top:7px;letter-spacing:.14em}
.adea-students .ag-quote .qbtn{
  margin-top:30px;background:transparent;border:1px solid rgba(255,255,255,.5);color:#fff;
  border-radius:100px;padding:12px 26px;cursor:pointer;font-family:var(--display);
  font-size:10.88px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  transition:all .2s ease}
.adea-students .ag-quote .qbtn:hover{background:#fff;color:var(--night);border-color:#fff}

/* ============ WALL ============ */
.adea-students .ag-wall{background:var(--paper);padding:0 0 96px}
.adea-students .ag-empty{
  padding:96px 28px;text-align:center;color:var(--muted);font-size:16px;
  background:var(--paper)}
.adea-students .ag-empty p{margin:0 0 18px}
.adea-students .ag-empty .ag-chip{background:var(--ink);border-color:var(--ink);color:#fff}

/* ============ SUCCESS-STORY VIDEOS ============ */
.adea-students .ag-videos{
  background:var(--shell);border-top:1px solid var(--line);padding:96px 0 104px}
/* Fills the .wrap container: three across on desktop, as large as the
   1240px flow allows, collapsing to two then one on smaller screens. */
.adea-students .ag-video-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:32px}
.adea-students .ag-video{margin:0}
.adea-students .ag-video-face{
  position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;
  border:1px solid var(--line);border-radius:12px;overflow:hidden;cursor:pointer;
  background:var(--night)}
.adea-students .ag-video-face img{
  width:100%;height:100%;object-fit:cover;transition:transform .5s ease,opacity .3s ease}
.adea-students .ag-video-face:hover img{transform:scale(1.03);opacity:.85}
.adea-students .ag-video-play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:68px;height:48px;border-radius:12px;background:var(--red);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 30px -8px rgba(0,0,0,.5);transition:transform .2s ease}
.adea-students .ag-video-play::after{
  content:"";border-style:solid;border-width:10px 0 10px 17px;
  border-color:transparent transparent transparent #fff;margin-left:4px}
.adea-students .ag-video-face:hover .ag-video-play{transform:translate(-50%,-50%) scale(1.08)}
.adea-students .ag-video iframe{
  display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:12px}
.adea-students .ag-video figcaption{
  margin-top:14px;font-family:var(--display);font-weight:700;font-size:16.8px;
  color:var(--ink)}

/* ============ CTA ============ */
.adea-students .ag-cta{background:var(--red);color:#fff;padding:104px 0;text-align:center}
.adea-students .ag-cta .wrap{max-width:820px}
.adea-students .ag-cta h2{
  font-family:var(--display);font-weight:800;color:#fff;letter-spacing:-.025em;
  font-size:clamp(32px,4vw,49.6px);line-height:1.1;margin:0 0 18px}
.adea-students .ag-cta p{max-width:52ch;margin:0 auto 36px;font-size:17.28px;color:rgba(255,255,255,.9)}
.adea-students .ag-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.adea-students .ag-btn{
  display:inline-block;padding:16px 36px;border-radius:100px;font-family:var(--display);
  font-size:13px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  text-decoration:none;transition:all .2s ease;border:1px solid transparent}
.adea-students .ag-btn-solid{background:#fff;color:var(--red)!important;border-color:#fff}
.adea-students .ag-btn-solid:hover{background:var(--night);border-color:var(--night);color:#fff!important}
.adea-students .ag-btn-ghost{background:transparent;color:#fff!important;border-color:rgba(255,255,255,.6)}
.adea-students .ag-btn-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}

/* ============ LIGHTBOX ============ */
.adea-students .ag-lb{
  position:fixed;inset:0;z-index:99999;background:rgba(14,11,10,.97);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .28s ease}
.adea-students .ag-lb.is-open{opacity:1;pointer-events:auto}
.adea-students .ag-lb-in{
  position:relative; /* anchors the close button to the card, not the viewport */
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  width:min(1240px,94vw);max-height:90vh;background:var(--night);
  border-radius:14px;overflow:hidden}
.adea-students .ag-lb.is-photo .ag-lb-in{grid-template-columns:1fr;width:min(880px,94vw)}
.adea-students .ag-lb-photo{position:relative;background:#0d0b0a;min-height:0}
.adea-students .ag-lb-photo img{width:100%;height:100%;max-height:90vh;object-fit:contain}
.adea-students .ag-lb-text{
  padding:52px 48px;overflow-y:auto;background:var(--paper);color:var(--ink);min-height:0}
.adea-students .ag-lb.is-photo .ag-lb-text{display:none}
.adea-students .ag-lb-tag{
  display:flex;align-items:center;gap:9px;margin-bottom:12px;
  font-family:var(--display);font-size:11.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gc,var(--muted))}
.adea-students .ag-lb-tag .swatch{width:9px;height:9px;border-radius:50%;background:var(--gc)}
.adea-students .ag-lb-text h3{
  font-family:var(--display);font-weight:800;font-size:clamp(27.2px,2.6vw,36.8px);
  letter-spacing:-.02em;line-height:1.12;margin:0 0 22px;color:var(--ink)}
.adea-students .ag-lb-text h3::after{
  content:"";display:block;width:52px;height:3px;background:var(--red);margin-top:18px}
/* Poppins is geometric and tiring over long prose, so the story gets a
   generous size, a ~62ch measure and loose leading to stay readable. */
.adea-students .ag-lb-story p{
  font-size:16.16px;line-height:1.85;color:var(--ink-soft);
  max-width:62ch;margin:0 0 17px}
.adea-students .ag-lb-story p:last-child{margin-bottom:0}
.adea-students .ag-lb-close,.adea-students .ag-lb-nav{
  position:absolute;z-index:5;width:44px;height:44px;border-radius:50%;
  background:rgba(20,16,14,.6);border:1px solid rgba(255,255,255,.22);color:#fff;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-size:18.4px;line-height:1;transition:all .18s ease;backdrop-filter:blur(8px)}
.adea-students .ag-lb-close:hover,.adea-students .ag-lb-nav:hover{background:var(--red);border-color:var(--red)}
.adea-students .ag-lb-close{top:16px;right:16px}
.adea-students .ag-lb-nav.prev{left:16px;top:50%;transform:translateY(-50%)}
.adea-students .ag-lb-nav.next{right:16px;top:50%;transform:translateY(-50%)}
.adea-students .ag-lb-counter{
  position:absolute;bottom:16px;left:16px;z-index:5;
  background:rgba(20,16,14,.6);backdrop-filter:blur(8px);color:#fff;
  border-radius:100px;padding:6px 14px;font-family:var(--display);
  font-size:11.5px;font-weight:700;letter-spacing:.1em}
@media (max-width:900px){
  .adea-students .ag-lb-in{grid-template-columns:1fr;max-height:94vh;width:94vw}
  .adea-students .ag-lb-photo img{max-height:44vh}
  .adea-students .ag-lb-text{padding:30px 24px 36px}
  .adea-students .ag-lb-nav{width:38px;height:38px}}

/* ============ PHONE ============
   Kept at the end deliberately: these overrides share specificity with the
   base card rules, so they must come last to win (an earlier copy of this
   block silently lost to `.ag-excerpt{display:-webkit-box}`).

   Two columns keeps the wall feeling like a gallery on a phone, but at ~160px
   wide the excerpt is unreadable noise -- the Story badge already says there
   is one, and tapping opens it. */
@media (max-width:520px){
  .adea-students .ag-masonry{grid-template-columns:1fr 1fr;column-gap:12px;--gap:12px}
  .adea-students .ag-excerpt,
  .adea-students .ag-more{display:none}
  .adea-students .ag-body{padding:12px 12px 14px}
  .adea-students .ag-tag{font-size:9.5px;letter-spacing:.09em;gap:6px;margin-bottom:6px}
  .adea-students .ag-tag::after{display:none}
  .adea-students .ag-name{font-size:15px;line-height:1.3}
  .adea-students .ag-badge{padding:4px 8px;font-size:9px;top:8px;left:8px}
  .adea-students .wrap{padding:0 16px}
  .adea-students .ag-stories{padding:56px 0 64px}
  .adea-students .ag-groupband{padding:36px 0 20px}
}

/* ============ MOTION ============ */
@media (prefers-reduced-motion:reduce){
  .adea-students *{animation:none!important;transition:none!important}
  .adea-students .ag-card.reveal{opacity:1;transform:none}
  .adea-students .ag-photo img{opacity:1}
}