/* =========================================================
   STUDYBRIDGE — GLOBAL STYLES
   ========================================================= */


/* =========================================================
   1. VARIABLES
   ========================================================= */

:root{
  --ink:#0E1B33;
  --navy:#16294A;
  --navy-soft:#1E3358;

  --paper:#F4F5F2;
  --paper-alt:#EAEBE4;

  --line:rgba(14,27,51,0.13);
  --line-soft:rgba(14,27,51,0.07);

  --gold:#C89A46;
  --gold-soft:#E4C077;

  --sky:#5C82AC;
  --stamp:#2F6B4C;

  --white:#FFFFFF;

  --shadow:0 20px 50px -25px rgba(14,27,51,0.35);
}


/* =========================================================
   2. RESET / BASE
   ========================================================= */

*{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'IBM Plex Sans',sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

h1,
h2,
h3,
h4{
  margin:0;
  font-family:'Fraunces',serif;
  font-weight:600;
  line-height:1.1;
  letter-spacing:-0.01em;
}

a{
  color:inherit;
  text-decoration:none;
}

img{
  max-width:100%;
  display:block;
}

section{
  position:relative;
}

:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
}

.wrap{
  max-width:1180px;
  margin:0 auto;
  padding:0 32px;
}

.mono{
  font-family:'IBM Plex Mono',monospace;
  letter-spacing:0.02em;
}


/* =========================================================
   3. EYEBROW
   ========================================================= */

.eyebrow{
  display:flex;
  align-items:center;
  gap:10px;

  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  font-weight:600;
  letter-spacing:0.14em;
  text-transform:uppercase;

  color:var(--gold);
}

.eyebrow::before{
  content:"";

  width:22px;
  height:1px;

  display:inline-block;

  background:var(--gold);
}


/* =========================================================
   4. ACCESSIBILITY / MOTION
   ========================================================= */

@media (prefers-reduced-motion:reduce){

  *{
    animation-duration:0.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.01ms !important;
    scroll-behavior:auto !important;
  }
}


/* =========================================================
   5. NAVIGATION
   ========================================================= */

#site-nav{
  position:fixed;
  top:0;
  left:0;
  right:0;

  z-index:1000;

  background:rgba(244,245,242,0.92);
  backdrop-filter:blur(10px);

  border-bottom:1px solid var(--line);

  transition:
    background .3s ease,
    box-shadow .3s ease;
}

#site-nav.scrolled{
  box-shadow:0 4px 24px -8px rgba(14,27,51,0.18);
}

.nav-inner{
  max-width:1180px;
  height:76px;

  margin:0 auto;
  padding:0 32px;

  display:flex;
  align-items:center;
  justify-content:space-between;
}

.brand{
  display:flex;
  align-items:center;
  gap:10px;
}

.brand-mark{
  width:34px;
  height:34px;

  border:1.5px solid var(--ink);
  border-radius:50%;

  display:flex;
  align-items:center;
  justify-content:center;

  position:relative;
}

.brand-mark span{
  font-family:'Fraunces',serif;
  font-weight:700;
  font-size:15px;
}

.brand-name{
  font-family:'Fraunces',serif;
  font-weight:600;
  font-size:20px;
  letter-spacing:-0.01em;
}

.brand-name em{
  color:var(--gold);
  font-style:normal;
}

.brand-logo-img{
  height:58px;
  width:auto;
  max-width:240px;
  object-fit:contain;
}


/* Navigation menu */

.nav-menu{
  display:flex;
  align-items:center;
  gap:2px;
}

.nav-item{
  position:relative;
}

.nav-link{
  display:flex;
  align-items:center;
  gap:5px;

  padding:14px 16px;

  font-size:14.5px;
  font-weight:500;

  cursor:pointer;
  white-space:nowrap;
}

.nav-link:hover,
.nav-link.active{
  color:var(--sky);
}

.nav-link svg{
  width:9px;
  height:9px;
  opacity:.55;

  transition:transform .2s ease;
}

.nav-item:hover .nav-link svg{
  transform:rotate(180deg);
}


/* Dropdown */

.dropdown{
  position:absolute;
  top:100%;
  left:50%;

  min-width:270px;

  padding:14px 8px 8px;

  background:var(--white);
  border:1px solid var(--line);

  box-shadow:var(--shadow);

  opacity:0;
  visibility:hidden;
  pointer-events:none;

  transform:translateX(-50%) translateY(6px);

  transition:
    opacity .15s ease,
    transform .15s ease;
}

.nav-item:hover .dropdown,
.nav-item.open .dropdown{
  opacity:1;
  visibility:visible;
  pointer-events:auto;

  transform:translateX(-50%) translateY(0);
}

.dropdown a{
  display:flex;
  align-items:baseline;
  gap:10px;

  padding:11px 14px;

  font-size:14px;
  font-weight:500;

  color:var(--ink);

  border-left:2px solid transparent;
}

.dropdown a:hover,
.dropdown a.current{
  background:var(--paper);
  border-left-color:var(--gold);
  color:var(--navy);
}

.dropdown a .tag{
  margin-left:auto;

  font-family:'IBM Plex Mono',monospace;
  font-size:10.5px;
  font-weight:600;

  color:var(--gold);
}


/* Navigation CTA */

.nav-cta{
  display:flex;
  align-items:center;
  gap:18px;
}


/* =========================================================
   6. BUTTONS
   ========================================================= */

.btn{
  display:inline-flex;
  align-items:center;
  gap:8px;

  padding:11px 22px;

  border:1px solid var(--ink);
  background:transparent;
  color:var(--ink);

  font-family:'IBM Plex Sans',sans-serif;
  font-size:14px;
  font-weight:600;

  cursor:pointer;

  transition:all .2s ease;
}

.btn-primary{
  background:var(--ink);
  color:var(--paper);
  border-color:var(--ink);
}

.btn-primary:hover{
  background:var(--navy-soft);
  border-color:var(--navy-soft);
}

.btn-ghost:hover{
  background:var(--ink);
  color:var(--paper);
}

.btn-gold{
  background:var(--gold);
  border-color:var(--gold);
  color:var(--ink);
}

.btn-gold:hover{
  background:var(--gold-soft);
  border-color:var(--gold-soft);
}


/* Hamburger */

.hamburger{
  display:none;

  flex-direction:column;
  gap:5px;

  padding:6px;

  cursor:pointer;
}

.hamburger span{
  width:22px;
  height:2px;
  background:var(--ink);
}


/* =========================================================
   7. BREADCRUMB / PAGE HERO
   ========================================================= */

.breadcrumb{
  max-width:1180px;

  margin:0 auto;
  padding:150px 32px 0;

  font-family:'IBM Plex Mono',monospace;
  font-size:12px;

  color:#7581A0;
}

.breadcrumb a:hover{
  color:var(--navy);
}

.breadcrumb .sep{
  margin:0 8px;
  opacity:.5;
}

.breadcrumb .current{
  color:var(--ink);
  font-weight:600;
}

.page-hero{
  padding:56px 0 80px;
}

.page-hero.on-ink{
  background:var(--ink);
  color:var(--paper);
}

.page-hero.on-ink .eyebrow{
  color:var(--gold-soft);
}

.page-hero .hero-flex{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;

  gap:40px;
  flex-wrap:wrap;
}

.page-hero h1{
  max-width:760px;

  margin:16px 0 18px;

  font-size:clamp(34px,4.4vw,54px);
}

.page-hero p.lead{
  max-width:600px;

  font-size:17px;
  color:#3B4863;
}

.page-hero.on-ink p.lead{
  color:#B9C2D6;
}

.hero-badges{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.badge{
  padding:8px 14px;

  border:1px solid var(--line);

  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  font-weight:600;
  letter-spacing:.04em;
}

.page-hero.on-ink .badge{
  border-color:rgba(244,245,242,.25);
  color:#D8DDEA;
}


/* =========================================================
   8. GENERIC SECTIONS
   ========================================================= */

.section{
  padding:100px 0;
}

.section-alt{
  background:var(--paper-alt);
}

.section-tight{
  padding:70px 0;
}

.section-head{
  max-width:640px;
  margin-bottom:52px;
}

.section-head h2{
  margin-top:14px;
  font-size:clamp(28px,3.2vw,40px);
}

.section-head p{
  margin-top:16px;

  font-size:16px;
  color:#4A5670;
}


/* =========================================================
   9. HERO
   ========================================================= */

.hero-v3{
  position:relative;

  height:680px;
  min-height:680px;

  margin-top:76px;

  display:flex;
  align-items:center;

  overflow:hidden;
  padding:0;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,.98) 0%,
      rgba(255,255,255,.94) 38%,
      rgba(255,255,255,.72) 58%,
      rgba(255,255,255,.20) 82%,
      rgba(255,255,255,.05) 100%
    ),
    linear-gradient(
      115deg,
      #f1ede5 0%,
      #f8f6f1 42%,
      #dfd1c4 100%
    );
}

.hero-v3-overlay{
  display:none !important;
}

.hero-v3::before{
  content:"";

  position:absolute;
  right:-4%;
  bottom:0;

  width:58%;
  height:100%;

  pointer-events:none;
  z-index:0;

  background:
    radial-gradient(
      ellipse at 55% 55%,
      rgba(200,154,70,.25) 0%,
      rgba(200,154,70,.08) 28%,
      transparent 58%
    );
}


/* Hero container */

.hero-v3-wrap{
  position:relative;
  z-index:20;

  width:100%;
  max-width:1180px;
  height:100%;

  margin:0 auto;

  display:flex;
  align-items:center;
  justify-content:flex-start;

  padding:0 32px;
}


/* Hero content */

.hero-v3-content{
  position:relative;
  z-index:30;

  width:52%;
  max-width:620px;

  margin:0;
  padding:0;
}


/* Hero eyebrow */

.hero-v3-eyebrow{
  margin:0 0 16px;
  padding:0;

  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:.14em;

  color:var(--gold);
}

.hero-v3-eyebrow::before{
  width:22px;
  height:1px;
  background:var(--gold);
}


/* Hero headline */

.hero-v3-content h1{
  max-width:600px;

  margin:0 !important;
  padding:0 !important;

  font-family:'Fraunces',Georgia,serif;
  font-size:62px;
  font-weight:600;
  line-height:.95;
  letter-spacing:-.035em;

  color:var(--navy);
}

.hero-v3-content h1 br + br{
  display:none;
}

.hero-v3-content h1 br{
  line-height:0;
}

.hero-v3-content h1 em,
.hero-v3-content h1 span,
.hero-v3-content h1 strong{
  margin:0;
  padding:0;
  line-height:inherit;
}

.hero-v3-content h1 em{
  color:var(--gold);
  font-style:italic;
  font-weight:500;
}


/* Hero mission */

.hero-v3-mission{
  display:block;

  width:90%;
  max-width:560px;

  margin:24px 0 0 !important;
  padding:0 !important;

  font-family:'IBM Plex Sans',sans-serif;
  font-size:16px;
  font-weight:400;
  line-height:1.55;

  color:#485469;
}

.hero-v3-mission p{
  margin:0 !important;
  padding:0 !important;
}

.hero-v3-mission strong{
  font-weight:400 !important;
}


/* Hero buttons */

.hero-v3-actions{
  position:relative;
  z-index:50;

  display:flex;
  align-items:center;
  flex-wrap:wrap;

  gap:12px;

  margin:26px 0 0 !important;
  padding:0 !important;
}

.hero-v3-btn{
  position:relative;
  z-index:50;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:48px;

  padding:0 23px;

  border-radius:3px;

  font-family:'IBM Plex Sans',sans-serif;
  font-size:13px;
  font-weight:600;
  line-height:1;

  text-decoration:none;
}

.hero-v3-btn-primary{
  background:var(--navy);
  border:1px solid var(--navy);
  color:var(--white);
}

.hero-v3-btn-outline{
  background:transparent;
  border:1px solid var(--navy);
  color:var(--navy);
}

.hero-v3-btn-primary:hover{
  background:var(--gold);
  border-color:var(--gold);
  color:var(--white);
}

.hero-v3-btn-outline:hover{
  background:var(--navy);
  border-color:var(--navy);
  color:var(--white);
}


/* =========================================================
   10. HERO ARTWORK
   ========================================================= */

.hero-v3-art{
  position:absolute;
  right:0;
  bottom:0;

  width:55%;
  height:100%;

  z-index:2;

  pointer-events:none;
}

.hero-v3-sails{
  position:absolute;

  right:16%;
  bottom:245px;

  width:370px;
  height:300px;
}

.hero-v3-sails span{
  position:absolute;
  bottom:0;

  display:block;

  clip-path:polygon(
    0 100%,
    100% 100%,
    50% 0
  );

  background:rgba(22,41,74,.17);
}

.hero-v3-sails span:nth-child(1){
  width:135px;
  height:220px;
  left:0;

  transform:skewX(-12deg);
}

.hero-v3-sails span:nth-child(2){
  width:170px;
  height:280px;
  left:100px;

  transform:skewX(-12deg);

  background:rgba(22,41,74,.23);
}

.hero-v3-sails span:nth-child(3){
  width:145px;
  height:215px;
  left:215px;

  transform:skewX(-12deg);

  background:rgba(22,41,74,.13);
}


/* =========================================================
   11. HERO GRADUATE
   ========================================================= */

.hero-v3-graduate{
  position:absolute;

  right:6%;
  bottom:-8px;

  width:390px;
  height:535px;

  z-index:5;
}

.hero-v3-body{
  position:absolute;

  right:0;
  bottom:0;

  width:325px;
  height:375px;

  background:
    linear-gradient(
      110deg,
      #101b2e 0%,
      #172942 48%,
      #2B3D57 100%
    );

  border-radius:48% 48% 0 0;

  transform:rotate(-5deg);

  box-shadow:
    -18px 10px 45px rgba(14,27,51,.15);
}

.hero-v3-head{
  position:absolute;

  right:120px;
  bottom:290px;

  width:116px;
  height:155px;

  background:
    linear-gradient(
      90deg,
      #211816 0%,
      #3E2924 60%,
      #57372C 100%
    );

  border-radius:50% 50% 44% 44%;

  box-shadow:
    0 5px 15px rgba(0,0,0,.12);
}

.hero-v3-head::before{
  content:"";

  position:absolute;

  top:-3px;
  left:0;

  width:100%;
  height:62px;

  background:#171313;

  border-radius:55% 55% 35% 35%;
}

.hero-v3-head::after{
  content:"";

  position:absolute;

  right:13px;
  top:50px;

  width:20px;
  height:48px;

  background:rgba(255,255,255,.06);

  border-radius:50%;
}


/* Graduation cap */

.hero-v3-cap-top{
  position:absolute;

  right:43px;
  bottom:410px;

  width:280px;
  height:108px;

  background:#10192B;

  clip-path:polygon(
    50% 0,
    100% 50%,
    50% 100%,
    0 50%
  );

  filter:
    drop-shadow(
      0 12px 10px rgba(0,0,0,.20)
    );
}

.hero-v3-cap-base{
  position:absolute;

  right:137px;
  bottom:391px;

  width:92px;
  height:50px;

  background:#111A2B;

  border-radius:9px;
}


/* Tassel */

.hero-v3-tassel{
  position:absolute;

  right:47px;
  bottom:296px;

  width:4px;
  height:130px;

  background:#B88836;
}

.hero-v3-tassel::after{
  content:"";

  position:absolute;

  bottom:-14px;
  left:-7px;

  width:18px;
  height:27px;

  background:#B88836;

  border-radius:0 0 9px 9px;
}


/* =========================================================
   12. ABOUT PAGE HERO
   ========================================================= */

.aboutus-hero{
  position:relative;
  overflow:hidden;
}

.aboutus-hero-decor{
  position:absolute;

  right:-8%;
  bottom:-15%;

  width:52%;
  height:85%;

  z-index:0;
  opacity:.7;

  background:
    repeating-linear-gradient(
      0deg,
      transparent 0 27px,
      rgba(14,27,51,.06) 28px 29px,
      transparent 30px 58px
    ),
    repeating-linear-gradient(
      90deg,
      transparent 0 42px,
      rgba(14,27,51,.05) 43px 44px,
      transparent 45px 82px
    );

  transform:skewX(-10deg);

  -webkit-mask-image:
    linear-gradient(to left,#000 50%,transparent);

  mask-image:
    linear-gradient(to left,#000 50%,transparent);
}

.aboutus-hero .wrap{
  position:relative;
  z-index:1;
}


/* =========================================================
   13. ABOUT — TEAM CARDS V2
   ========================================================= */

.team-grid-v2{
  display:grid;
  grid-template-columns:280px 1fr;

  gap:40px;

  align-items:start;
}

.team-cards-v2{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:18px;
}

.team-card-v2{
  min-height:210px;

  padding:26px 18px;

  border:1px solid var(--line);
  border-radius:10px;

  background:var(--white);

  box-shadow:0 9px 25px rgba(14,27,51,.05);

  text-align:center;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

.avatar-placeholder{
  position:relative;

  width:70px;
  height:70px;

  margin-bottom:14px;

  border-radius:50%;

  background:var(--paper-alt);

  display:flex;
  align-items:center;
  justify-content:center;
}

.avatar-placeholder::before{
  content:"";

  position:absolute;

  top:14px;

  width:18px;
  height:18px;

  border:2px solid var(--navy);
  border-radius:50%;
}

.avatar-placeholder::after{
  content:"";

  position:absolute;

  bottom:14px;

  width:30px;
  height:16px;

  border:2px solid var(--navy);
  border-bottom:0;

  border-radius:20px 20px 0 0;
}

.avatar-photo{
  width:70px;
  height:70px;

  margin-bottom:14px;

  border-radius:50%;
  border:2px solid var(--paper-alt);

  object-fit:cover;
}

.team-card-v2 h4{
  margin:0 0 4px;

  font-family:'Fraunces',serif;
  font-size:17px;
}

.team-card-v2 .role{
  font-family:'IBM Plex Mono',monospace;
  font-size:12.5px;

  color:var(--gold);

  text-transform:uppercase;
  letter-spacing:.05em;
}

.team-card-icons{
  display:flex;
  gap:10px;

  margin-top:14px;
}

.team-card-icons a{
  width:28px;
  height:28px;

  border-radius:50%;

  background:var(--navy);
  color:var(--white);

  display:flex;
  align-items:center;
  justify-content:center;
}


/* =========================================================
   14. ABOUT — PARTNERS BOX
   ========================================================= */

.partners-box-v2{
  min-height:180px;

  margin-top:10px;
  padding:26px;

  border:1.5px dashed #C9CDD3;
  border-radius:10px;

  display:flex;
  align-items:center;
  justify-content:center;

  text-align:center;
}

.partners-box-v2 p{
  margin:0;

  color:#7581A0;
  font-size:14px;
}


/* =========================================================
   15. ABOUT — CTA FLEX
   ========================================================= */

.cta-flex{
  padding:44px 0;

  background:var(--ink);
  color:var(--paper);
}

.cta-flex-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:24px;
  flex-wrap:wrap;
}

.cta-flex h2{
  margin:0 0 6px;

  color:var(--paper);
  font-size:30px;
}

.cta-flex p{
  margin:0;

  color:#B9C2D6;
  font-size:14.5px;
}


/* =========================================================
   16. PARTNERS
   ========================================================= */

.partner-group{
  margin-top:36px;
}

.partner-group:first-child{
  margin-top:0;
}

.partner-group h3{
  margin:0 0 18px;

  color:var(--gold);

  font-family:'IBM Plex Mono',monospace;
  font-size:13px;
  font-weight:600;

  text-transform:uppercase;
  letter-spacing:.1em;
}

.partner-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));

  gap:18px;
}

.partner-card{
  padding:22px 16px;

  border:1px solid var(--line);
  border-radius:12px;

  background:var(--white);

  text-align:center;

  transition:
    transform .2s ease,
    box-shadow .2s ease;
}

.partner-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow);
}

.partner-logo-badge{
  width:56px;
  height:56px;

  margin:0 auto 14px;

  border-radius:14px;

  display:flex;
  align-items:center;
  justify-content:center;

  font-family:'Fraunces',serif;
  font-size:22px;
  font-weight:700;

  color:#fff;
}

.partner-logo-img{
  width:56px;
  height:56px;

  margin:0 auto 14px;

  border-radius:14px;
  border:1px solid var(--line);

  object-fit:contain;

  background:#fff;
}

.partner-card span{
  display:block;

  color:var(--navy);
  font-size:14px;
  font-weight:600;
  line-height:1.4;
}


/* =========================================================
   17. SERVICES
   ========================================================= */

.services-icon-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:24px;
}

.service-card-v2{
  padding:36px 24px;

  border:1px solid var(--line);
  border-radius:14px;

  background:var(--white);

  text-align:center;

  transition:
    transform .2s ease,
    box-shadow .2s ease;
}

.service-card-v2:hover{
  transform:translateY(-5px);
  box-shadow:var(--shadow);
}

.service-icon-badge{
  width:62px;
  height:62px;

  margin:0 auto 18px;

  border-radius:50%;

  background:var(--navy);

  display:flex;
  align-items:center;
  justify-content:center;
}

.service-card-v2 h4{
  margin-bottom:10px;

  font-family:'Fraunces',serif;
  font-size:18px;
}

.service-underline{
  width:34px;
  height:2px;

  margin:0 auto 14px;

  background:var(--gold);
}

.service-card-v2 p{
  margin:0;

  color:#4A5670;
  font-size:13.5px;
  line-height:1.5;
}


/* =========================================================
   18. STAT STRIP
   ========================================================= */

.strip{
  padding:30px 0;

  background:var(--navy);
  color:var(--paper);
}

.strip .wrap{
  display:flex;
  justify-content:space-between;

  gap:24px;
  flex-wrap:wrap;
}

.strip-item{
  display:flex;
  align-items:baseline;
  gap:10px;
}

.strip-item .n{
  font-family:'Fraunces',serif;
  font-size:22px;
  font-weight:600;

  color:var(--gold-soft);
}

.strip-item .t{
  font-size:13px;
  color:#B9C2D6;
}


/* =========================================================
   19. CARDS / GRIDS
   ========================================================= */

.card-grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:26px;
}

.card-grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:26px;
}

.card-grid-4{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:26px;
}

.info-card{
  padding:30px 28px;

  border:1px solid var(--line);

  background:var(--white);
}

.info-card .k{
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;

  color:var(--gold);

  text-transform:uppercase;
  letter-spacing:.08em;
}

.info-card h4{
  margin:12px 0 10px;
  font-size:19px;
}

.info-card p{
  margin:0;

  color:#4A5670;
  font-size:14px;
}


/* =========================================================
   20. FLAGS
   ========================================================= */

.flag-img{
  width:60px;
  height:60px;

  border:2.5px solid rgba(228,192,119,.5);
  border-radius:50%;

  object-fit:cover;

  box-shadow:0 4px 14px rgba(0,0,0,.25);
}

.flag-img-sm{
  width:44px;
  height:44px;

  margin-bottom:6px;

  border:2px solid var(--gold);

  box-shadow:none;
}


/* =========================================================
   21. TIMELINE
   ========================================================= */

.timeline{
  margin-left:6px;

  border-left:1.5px solid var(--line);
}

.tl-item{
  position:relative;

  padding:0 0 46px 34px;
}

.tl-item:last-child{
  padding-bottom:0;
}

.tl-item::before{
  content:"";

  position:absolute;

  left:-6.5px;
  top:4px;

  width:11px;
  height:11px;

  border:2px solid var(--paper);
  border-radius:50%;

  background:var(--gold);

  box-shadow:0 0 0 1.5px var(--gold);
}

.tl-year{
  font-family:'IBM Plex Mono',monospace;
  font-size:12.5px;
  font-weight:600;

  color:var(--gold);
}

.tl-item h4{
  margin:8px 0;
  font-size:19px;
}

.tl-item p{
  max-width:560px;

  margin:0;

  color:#4A5670;
  font-size:14.5px;
}


/* =========================================================
   22. PROCESS STEPS
   ========================================================= */

.steps{
  display:grid;
  grid-template-columns:70px 1fr;
  gap:0 30px;
}

.step{
  display:contents;
}

.step-num{
  padding-top:4px;

  font-family:'IBM Plex Mono',monospace;
  font-size:13px;
  font-weight:600;

  color:var(--gold);
}

.step-body{
  margin-bottom:38px;
  padding-bottom:38px;

  border-bottom:1px solid var(--line-soft);
}

.step:last-child .step-body{
  margin-bottom:0;
  padding-bottom:0;

  border-bottom:none;
}

.step-body h4{
  margin-bottom:8px;
  font-size:19px;
}

.step-body p{
  max-width:560px;

  margin:0;

  color:#4A5670;
  font-size:14.5px;
}


/* =========================================================
   23. CHECKLIST
   ========================================================= */

.checklist{
  display:grid;
  grid-template-columns:1fr 1fr;

  gap:14px 26px;

  margin:0;
  padding:0;

  list-style:none;
}

.checklist li{
  display:flex;
  align-items:flex-start;

  gap:10px;

  font-size:14.5px;
}

.checklist li::before{
  content:"✓";

  flex-shrink:0;

  color:var(--stamp);
  font-weight:700;
}


/* =========================================================
   24. FAQ
   ========================================================= */

.faq{
  max-width:760px;
}

.faq details{
  padding:20px 0;

  border-top:1px solid var(--line);
}

.faq details:last-child{
  border-bottom:1px solid var(--line);
}

.faq summary{
  display:flex;
  align-items:center;
  justify-content:space-between;

  cursor:pointer;
  list-style:none;

  font-family:'Fraunces',serif;
  font-size:16px;
  font-weight:600;
}

.faq summary::-webkit-details-marker{
  display:none;
}

.faq summary::after{
  content:"+";

  font-family:'IBM Plex Mono',monospace;
  font-size:20px;

  color:var(--gold);
}

.faq details[open] summary::after{
  content:"−";
}

.faq p{
  max-width:640px;

  margin:14px 0 0;

  color:#4A5670;
  font-size:14.5px;
}


/* =========================================================
   25. TABLE
   ========================================================= */

.table-wrap{
  overflow-x:auto;

  border:1px solid var(--line);
}

table.sb-table{
  width:100%;
  min-width:640px;

  border-collapse:collapse;
}

table.sb-table th{
  padding:14px 20px;

  background:var(--navy);
  color:var(--gold-soft);

  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  font-weight:600;

  text-align:left;
  text-transform:uppercase;
  letter-spacing:.08em;
}

table.sb-table td{
  padding:16px 20px;

  border-top:1px solid var(--line);

  font-size:14.5px;
}

table.sb-table tr:nth-child(even) td{
  background:var(--paper-alt);
}


/* =========================================================
   26. BOARD
   ========================================================= */

.board{
  border:1px solid var(--line);
  background:var(--white);
}

.board-head{
  display:grid;
  grid-template-columns:120px 1.6fr 1fr 1fr 140px;

  padding:16px 24px;

  border-bottom:1px solid var(--line);

  color:var(--gold);

  font-family:'IBM Plex Mono',monospace;
  font-size:11px;

  text-transform:uppercase;
  letter-spacing:.1em;
}

.board-row{
  display:grid;
  grid-template-columns:120px 1.6fr 1fr 1fr 140px;

  padding:22px 24px;

  align-items:center;

  border-bottom:1px solid var(--line-soft);

  transition:background .2s ease;
}

.board-row:hover{
  background:var(--paper-alt);
}

.board-row:last-child{
  border-bottom:none;
}

.board-code{
  color:var(--gold);

  font-family:'IBM Plex Mono',monospace;
  font-size:20px;
  font-weight:600;
}

.board-name h4{
  font-family:'Fraunces',serif;
  font-size:18px;
  font-weight:600;
}

.board-name p{
  max-width:340px;

  margin:5px 0 0;

  color:#5C6784;
  font-size:13px;
}

.board-meta{
  color:#3B4863;
  font-size:13px;
}

.board-meta .l{
  display:block;

  margin-bottom:4px;

  color:#8792AC;

  font-family:'IBM Plex Mono',monospace;
  font-size:10px;

  text-transform:uppercase;
  letter-spacing:.08em;
}

.board-status{
  text-align:right;
}

.pill{
  display:inline-block;

  padding:6px 12px;

  font-family:'IBM Plex Mono',monospace;
  font-size:10.5px;
  font-weight:600;

  letter-spacing:.05em;
  text-transform:uppercase;
}

.pill-open{
  background:var(--stamp);
  color:var(--white);
}

.pill-popular{
  background:var(--gold);
  color:var(--ink);
}

.pill-fast{
  background:var(--sky);
  color:var(--white);
}


/* =========================================================
   27. FEE STRIP
   ========================================================= */

.fee-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  border:1px solid var(--line);
}

.fee-item{
  padding:28px 26px;

  border-left:1px solid var(--line);
}

.fee-item:first-child{
  border-left:none;
}

.fee-item .l{
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;

  color:var(--gold);

  text-transform:uppercase;
  letter-spacing:.08em;
}

.fee-item .v{
  margin-top:8px;

  font-family:'Fraunces',serif;
  font-size:26px;
}

.fee-item .d{
  margin-top:6px;

  color:#5C6784;
  font-size:12.5px;
}


/* =========================================================
   28. PASSPORT PAGE
   ========================================================= */

.passport-page{
  position:relative;

  padding:34px 30px 30px;

  overflow:hidden;

  background:var(--ink);

  box-shadow:var(--shadow);
}

.passport-page::before{
  content:"";

  position:absolute;
  inset:0;

  background-image:
    repeating-linear-gradient(
      0deg,
      rgba(244,245,242,.035) 0,
      rgba(244,245,242,.035) 1px,
      transparent 1px,
      transparent 34px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(244,245,242,.035) 0,
      rgba(244,245,242,.035) 1px,
      transparent 1px,
      transparent 34px
    );
}

.passport-head{
  position:relative;

  display:flex;
  align-items:baseline;
  justify-content:space-between;

  margin-bottom:22px;
  padding-bottom:16px;

  border-bottom:1px dashed rgba(228,192,119,.35);
}

.passport-head .t1{
  color:var(--gold-soft);

  font-family:'IBM Plex Mono',monospace;
  font-size:10.5px;

  text-transform:uppercase;
  letter-spacing:.14em;
}

.passport-head .t2{
  color:var(--paper);

  font-family:'Fraunces',serif;
  font-size:18px;
  font-weight:600;
}

.stamp-grid{
  position:relative;

  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:14px;
}

.stamp{
  aspect-ratio:1;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  gap:2px;

  border:1.5px dashed rgba(228,192,119,.55);
  border-radius:50%;

  background:rgba(228,192,119,.04);

  text-align:center;
}

.stamp .code{
  color:var(--gold-soft);

  font-family:'Fraunces',serif;
  font-size:19px;
  font-weight:700;
}

.stamp .name{
  padding:0 6px;

  color:#B9C2D6;

  font-family:'IBM Plex Mono',monospace;
  font-size:8.5px;

  line-height:1.2;

  text-transform:uppercase;
  letter-spacing:.05em;
}

.stamp:nth-child(1){
  transform:rotate(-6deg);
}

.stamp:nth-child(2){
  transform:rotate(4deg);
}

.stamp:nth-child(3){
  transform:rotate(-3deg);
}

.stamp:nth-child(4){
  transform:rotate(7deg);
}

.stamp:nth-child(5){
  transform:rotate(5deg);
}

.stamp:nth-child(6){
  transform:rotate(-7deg);
}

.stamp:nth-child(7){
  transform:rotate(3deg);
}

.stamp:nth-child(8){
  transform:rotate(-4deg);
}

.passport-foot{
  position:relative;

  margin-top:22px;
  padding-top:16px;

  border-top:1px dashed rgba(228,192,119,.35);

  color:#8792AC;

  font-family:'IBM Plex Mono',monospace;
  font-size:10.5px;

  text-align:center;
  letter-spacing:.06em;
}


/* =========================================================
   29. TEAM
   ========================================================= */

.team-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);

  gap:26px;
}

.team-card{
  background:var(--white);
  border:1px solid var(--line);

  transition:
    transform .25s ease,
    box-shadow .25s ease;
}

.team-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow);
}

.team-photo{
  position:relative;

  aspect-ratio:1;

  display:flex;
  align-items:center;
  justify-content:center;

  background:linear-gradient(
    135deg,
    var(--navy),
    var(--sky)
  );

  color:var(--paper);

  font-family:'Fraunces',serif;
  font-size:34px;
  font-weight:600;
}

.team-photo::after{
  content:"";

  position:absolute;
  inset:0;

  background-image:
    radial-gradient(
      circle,
      rgba(255,255,255,.12) 1.4px,
      transparent 1.4px
    );

  background-size:14px 14px;
}

.team-info{
  padding:18px 20px 22px;
}

.team-info h4{
  font-size:17px;
}

.team-info .role{
  margin:6px 0 10px;

  color:var(--gold);

  font-family:'IBM Plex Mono',monospace;
  font-size:11.5px;

  text-transform:uppercase;
  letter-spacing:.06em;
}

.team-info p{
  margin:0;

  color:#59627C;
  font-size:13.5px;
}

.team-info .meta{
  display:flex;
  gap:10px;

  margin-top:12px;

  color:#7581A0;

  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
}


/* Team intro rich text */

.lead strong{
  font-weight:400 !important;
}

.lead p{
  margin:0 !important;
}


/* =========================================================
   30. CONTACT
   ========================================================= */

.contact-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;

  gap:60px;
}

.contact-row{
  display:flex;
  gap:16px;

  padding:18px 0;

  border-top:1px solid var(--line);
}

.contact-row:first-of-type{
  border-top:none;
}

.contact-row .ico{
  width:36px;
  height:36px;

  flex-shrink:0;

  display:flex;
  align-items:center;
  justify-content:center;

  border:1px solid var(--ink);
  border-radius:50%;

  font-size:14px;
}

.contact-row .l{
  margin-bottom:4px;

  color:var(--gold);

  font-family:'IBM Plex Mono',monospace;
  font-size:11px;

  text-transform:uppercase;
  letter-spacing:.08em;
}

.contact-row .v{
  font-size:14.5px;
}

.form-card{
  padding:40px;

  border:1px solid var(--line);

  background:var(--white);
}

.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;

  gap:18px;
}

.field{
  display:flex;
  flex-direction:column;
  gap:7px;

  margin-bottom:18px;
}

.field.full{
  grid-column:1 / -1;
}

.field label{
  color:var(--navy);

  font-size:12.5px;
  font-weight:600;
}

.field input,
.field select,
.field textarea{
  padding:10px 2px;

  border:none;
  border-bottom:1.5px solid var(--line);

  background:transparent;

  color:var(--ink);

  font-family:'IBM Plex Sans',sans-serif;
  font-size:14.5px;
}

.field input:focus,
.field select:focus,
.field textarea:focus{
  outline:none;
  border-bottom-color:var(--gold);
}

.field textarea{
  min-height:80px;
  resize:vertical;
}

.form-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:16px;
  flex-wrap:wrap;

  margin-top:8px;
}

.form-note{
  color:#7581A0;
  font-size:12.5px;
}

.office-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:20px;

  margin-top:20px;
}

.office-card{
  padding:22px;

  border:1px solid var(--line);

  background:var(--white);
}

.office-card h5{
  margin-bottom:8px;

  font-family:'Fraunces',serif;
  font-size:16px;
}

.office-card p{
  margin:2px 0;

  color:#5C6784;
  font-size:13px;
}


/* =========================================================
   31. CTA BAND
   ========================================================= */

.cta-band{
  padding:70px 0;

  background:var(--ink);
  color:var(--paper);

  text-align:center;
}

.cta-band h2{
  margin-bottom:18px;

  color:var(--paper);
  font-size:clamp(26px,3vw,36px);
}

.cta-band p{
  max-width:520px;

  margin:0 auto 30px;

  color:#B9C2D6;
}

.cta-actions{
  display:flex;
  justify-content:center;

  gap:14px;
  flex-wrap:wrap;
}


/* =========================================================
   32. RELATED LINKS
   ========================================================= */

.related{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:20px;
}

.related a{
  display:block;

  padding:24px;

  border:1px solid var(--line);

  background:var(--white);

  transition:
    box-shadow .2s ease,
    transform .2s ease;
}

.related a:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow);
}

.related .tag{
  color:var(--gold);

  font-family:'IBM Plex Mono',monospace;
  font-size:10.5px;

  text-transform:uppercase;
  letter-spacing:.08em;
}

.related h5{
  margin:10px 0 6px;

  font-family:'Fraunces',serif;
  font-size:17px;
}

.related p{
  margin:0;

  color:#5C6784;
  font-size:13px;
}


/* =========================================================
   33. FOOTER CTA
   ========================================================= */

.footer-cta-wrap{
  padding:40px 0 60px;

  background:var(--paper);
}

.footer-cta{
  max-width:1180px;

  margin:0 auto;
  padding:34px 40px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:24px;
  flex-wrap:wrap;

  border-radius:16px;

  background:var(--ink);
}

.footer-cta-left{
  display:flex;
  align-items:center;
  gap:22px;
}

.footer-cta-icon{
  width:56px;
  height:56px;

  flex-shrink:0;

  display:flex;
  align-items:center;
  justify-content:center;

  border:1.5px solid var(--gold);
  border-radius:12px;
}

.footer-cta-text h3{
  margin-bottom:6px;

  color:var(--paper);
  font-size:24px;
}

.footer-cta-text p{
  margin:0;

  color:#AEB7CC;
  font-size:14.5px;
}

.footer-cta .btn-gold{
  flex-shrink:0;
}


/* =========================================================
   34. FOOTER
   ========================================================= */

footer{
  padding:56px 0 0;

  background:var(--paper-alt);
  color:var(--ink);
}

.foot-grid{
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr;

  gap:50px;

  padding-bottom:50px;

  border-bottom:none;
}

.foot-col{
  padding-left:40px;

  border-left:1px solid var(--line);
}

.foot-brand-mark{
  display:flex;
  align-items:center;
  gap:14px;
}

.foot-brand-ring{
  width:58px;
  height:58px;

  flex-shrink:0;

  display:flex;
  align-items:center;
  justify-content:center;

  border:1.5px solid var(--gold);
  border-radius:50%;
}

.foot-brand-ring span{
  color:var(--navy);

  font-family:'Fraunces',serif;
  font-size:19px;
  font-weight:700;
}

.foot-brand-logo-img{
  height:64px;
  width:auto;
  max-width:240px;

  object-fit:contain;
}

.foot-wordmark{
  color:var(--navy);

  font-family:'Fraunces',serif;
  font-size:24px;
  font-weight:700;

  line-height:1.1;
}

.foot-wordmark em{
  color:var(--gold);
  font-style:normal;
}

.foot-subwordmark{
  margin-top:3px;

  color:#5C6784;

  font-family:'IBM Plex Mono',monospace;
  font-size:10px;

  text-transform:uppercase;
  letter-spacing:.12em;
}

.foot-brand p{
  max-width:280px;

  margin:20px 0 22px;

  color:#3B4863;

  font-size:14.5px;
  line-height:1.5;
}

.foot-social{
  display:flex;
  gap:10px;
}

.foot-social a{
  width:38px;
  height:38px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:50%;

  background:var(--navy);
  color:var(--paper);

  transition:background .2s ease;
}

.foot-social a:hover{
  background:var(--gold);
}

.foot-col h5{
  display:inline-block;

  margin-bottom:10px;
  padding-bottom:12px;

  color:var(--navy);

  font-family:'Fraunces',serif;
  font-size:19px;
  font-weight:600;

  text-transform:none;
  letter-spacing:0;

  border-bottom:2px solid var(--gold);
}

.foot-col-links{
  margin-top:18px;
}

.foot-col-links a{
  display:flex;
  align-items:center;
  justify-content:space-between;

  padding:11px 0;

  border-bottom:1px solid var(--line-soft);

  color:var(--ink);

  font-size:15px;
}

.foot-col-links a:first-child{
  border-top:none;
}

.foot-col-links a:hover{
  color:var(--gold);
}

.foot-col-links a svg{
  flex-shrink:0;
  opacity:.5;
}


/* Footer bottom */

.foot-bottom{
  padding:22px 0;

  background:var(--ink);

  text-align:center;
}

.foot-bottom span{
  color:#C8CDD6;
  font-size:13px;
}

.foot-bottom,
.foot-bottom a,
.foot-bottom a:visited,
.foot-bottom a:hover,
.foot-bottom a:active{
  color:#C8CDD6 !important;
}


/* =========================================================
   35. MOBILE MENU
   ========================================================= */

#mobile-panel{
  position:fixed;
  inset:0 0 0 auto;

  width:min(340px,86vw);

  padding:26px;

  overflow-y:auto;

  z-index:1200;

  background:var(--ink);
  color:var(--paper);

  transform:translateX(100%);

  transition:transform .3s ease;
}

#mobile-panel.open{
  transform:translateX(0);
}

#mobile-panel .m-close{
  margin-bottom:20px;

  font-size:22px;
  text-align:right;

  cursor:pointer;
}

#mobile-panel details{
  padding:14px 0;

  border-bottom:1px solid rgba(244,245,242,.14);
}

#mobile-panel summary{
  display:flex;
  justify-content:space-between;

  font-size:16px;
  font-weight:600;

  cursor:pointer;
  list-style:none;
}

#mobile-panel summary::-webkit-details-marker{
  display:none;
}

#mobile-panel .sub a{
  display:block;

  padding:10px 0 10px 14px;

  color:#C7CEE0;
  font-size:14px;
}

#mobile-panel > a{
  display:block;

  padding:14px 0;

  border-bottom:1px solid rgba(244,245,242,.14);

  font-size:16px;
  font-weight:600;
}


/* Mobile overlay */

#overlay{
  position:fixed;
  inset:0;

  z-index:1100;

  background:rgba(14,27,51,.4);

  opacity:0;
  visibility:hidden;

  transition:opacity .3s ease;
}

#overlay.open{
  opacity:1;
  visibility:visible;
}


/* =========================================================
   36. RESPONSIVE — TABLET
   ========================================================= */

@media (max-width:980px){

  /* Navigation */

  .nav-menu,
  .nav-cta .btn-ghost{
    display:none;
  }

  .hamburger{
    display:flex;
  }

  .hide-on-mobile{
    display:none;
  }


  /* Breadcrumb */

  .breadcrumb{
    padding-top:118px;
  }


  /* General grids */

  .hero-grid,
  .about-grid,
  .contact-grid{
    grid-template-columns:1fr;
  }

  .team-grid,
  .card-grid-4{
    grid-template-columns:repeat(2,1fr);
  }

  .card-grid-3,
  .related,
  .office-grid,
  .fee-strip{
    grid-template-columns:1fr;
  }


  /* Fee strip */

  .fee-item{
    border-left:none;
    border-top:1px solid var(--line);
  }

  .fee-item:first-child{
    border-top:none;
  }


  /* Steps */

  .steps{
    grid-template-columns:1fr;
  }

  .step-num{
    padding-top:0;
    margin-bottom:6px;
  }


  /* Board */

  .board-head{
    display:none;
  }

  .board-row{
    grid-template-columns:1fr;

    gap:10px;

    text-align:left;
  }

  .board-status{
    text-align:left;
  }


  /* Footer */

  .foot-grid{
    grid-template-columns:1fr 1fr;
  }

  .foot-col{
    padding-left:0;
    border-left:none;
  }


  /* Forms */

  .form-grid{
    grid-template-columns:1fr;
  }

  .checklist{
    grid-template-columns:1fr;
  }


  /* Footer CTA */

  .footer-cta{
    flex-direction:column;
    align-items:flex-start;

    text-align:left;
  }

  .footer-cta .btn-gold{
    width:100%;
    justify-content:center;
  }


  /* Services */

  .services-icon-grid{
    grid-template-columns:repeat(2,1fr);
  }


  /* About */

  .team-grid-v2{
    grid-template-columns:1fr;
  }

  .team-cards-v2{
    grid-template-columns:repeat(2,1fr);
  }

  .aboutus-hero-decor{
    width:70%;
    opacity:.3;
  }


  /* Hero */

  .hero-v3-content{
    width:68%;
  }

  .hero-v3-art{
    width:48%;
    opacity:.55;
  }

  .hero-v3-graduate{
    right:-80px;

    transform:scale(.9);
    transform-origin:bottom right;
  }

  .hero-v3-sails{
    right:-20px;

    transform:scale(.85);
    transform-origin:bottom right;
  }
}


/* =========================================================
   37. RESPONSIVE — 860px
   ========================================================= */

@media (max-width:860px){

  .hero-v3{
    height:auto;
    min-height:760px;

    padding:120px 0 70px;

    align-items:flex-start;
  }

  .hero-v3-wrap{
    height:auto;
  }

  .hero-v3-content{
    width:100%;
    max-width:700px;
  }

  .hero-v3-content h1{
    max-width:620px;
    font-size:50px;
  }

  .hero-v3-mission{
    max-width:560px;
    font-size:18px;
  }

  .hero-v3-art{
    width:70%;
    opacity:.30;
  }

  .hero-v3-graduate{
    right:-70px;
  }
}


/* =========================================================
   38. RESPONSIVE — 820px
   ========================================================= */

@media (max-width:820px){

  .team-grid-v2{
    grid-template-columns:1fr;
  }

  .team-cards-v2{
    grid-template-columns:repeat(2,1fr);
  }

  .aboutus-hero-decor{
    width:70%;
    opacity:.3;
  }
}


/* =========================================================
   39. RESPONSIVE — 768px
   ========================================================= */

@media (max-width:768px){

  .hero-v3{
    height:auto;
    min-height:720px;

    padding:0;
  }

  .hero-v3-wrap{
    height:auto;
    min-height:720px;

    padding-top:70px;
    padding-bottom:70px;

    align-items:flex-start;
  }

  .hero-v3-content{
    width:100%;
    max-width:100%;
  }

  .hero-v3-content h1{
    max-width:100%;

    font-size:48px;
    line-height:1;
  }

  .hero-v3-mission{
    width:100%;
    font-size:15px;
  }

  .hero-v3-actions{
    flex-wrap:wrap;
  }
}


/* =========================================================
   40. RESPONSIVE — 600px
   ========================================================= */

@media (max-width:600px){

  .wrap{
    padding:0 20px;
  }

  .breadcrumb{
    padding-left:20px;
    padding-right:20px;
  }


  /* General grids */

  .team-grid,
  .card-grid-2,
  .card-grid-4{
    grid-template-columns:1fr;
  }

  .foot-grid{
    grid-template-columns:1fr;
  }

  .foot-col{
    padding-left:0;
    border-left:none;
  }


  /* About */

  .team-cards-v2{
    grid-template-columns:1fr;
  }

  .partners-box-v2{
    padding:20px;
  }

  .cta-flex-inner{
    flex-direction:column;
    align-items:flex-start;
  }


  /* Flags */

  .flag-img{
    width:48px;
    height:48px;
  }


  /* Passport */

  .stamp .name{
    display:none;
  }

  .stamp .code{
    font-size:16px;
  }


  /* Hero */

  .hero-v3{
    min-height:760px;
    padding:110px 0 55px;
  }

  .hero-v3-content .eyebrow{
    margin-bottom:24px;

    font-size:11px;
    letter-spacing:.13em;
  }

  .hero-v3-content .eyebrow::before{
    width:25px;
  }

  .hero-v3-content h1{
    font-size:43px;
    line-height:1.08;
    letter-spacing:-.02em;
  }

  .hero-v3-mission{
    font-size:16px;
    line-height:1.55;
  }

  .hero-v3-actions{
    flex-direction:column;
    align-items:stretch;

    gap:12px;

    margin-top:30px !important;
  }

  .hero-v3-btn{
    width:100%;
  }

  .hero-v3-art{
    width:100%;
    opacity:.20;
  }

  .hero-v3-graduate{
    right:-130px;

    transform:scale(.85);
    transform-origin:bottom right;
  }

  .hero-v3-sails{
    right:-40px;

    transform:scale(.72);
    transform-origin:bottom right;
  }
}


/* =========================================================
   41. RESPONSIVE — 600px ABOUT / CTA
   ========================================================= */

@media (max-width:600px){

  .team-cards-v2{
    grid-template-columns:1fr;
  }

  .partners-box-v2{
    padding:20px;
  }

  .cta-flex-inner{
    flex-direction:column;
    align-items:flex-start;
  }
}