/* =========================================================
   LEGACY INTELLIGENCE — GLOBAL STYLES
   Clean production version

   Contains only:
   - design tokens and fonts
   - reset and global elements
   - header and navigation
   - homepage/shared card system
   - footer
   - shared buttons and interactive effects
   - shared expertise list and modal

   Page-specific styling belongs in each page stylesheet.
========================================================= */

:root{
  --dark:#28231d;
  --cream:#f1efe3;
  --menu-bg:rgba(241,239,227,1);
  --sage:#8e955f;
  --brown:#6c4943;
  --black:#11100e;
  --white:#f4efe4;
  --ink:#1b1a17;
  --gap:14px;
  --green:#17231a;
  --maslina:#a8ad88;
}

/* CANELA */

@font-face{
  font-family:"Canela";
  src:url("assets/fonts/Canela-Light.woff") format("woff");
  font-weight:300;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Canela";
  src:url("assets/fonts/Canela-Regular.woff") format("woff");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Canela";
  src:url("assets/fonts/Canela-Medium.woff") format("woff");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Canela";
  src:url("assets/fonts/Canela-Bold.woff") format("woff");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Canela";
  src:url("assets/fonts/Canela-Black.woff") format("woff");
  font-weight:900;
  font-style:normal;
  font-display:swap;
}




/* INTER */

@font-face{
  font-family:"Inter";
  src:url("assets/fonts/Inter18pt-Light.woff2") format("woff2");
  font-weight:300;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Inter";
  src:url("assets/fonts/Inter18pt-Regular.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Inter";
  src:url("assets/fonts/Inter18pt-Medium.woff2") format("woff2");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Inter";
  src:url("assets/fonts/Inter18pt-SemiBold.woff2") format("woff2");
  font-weight:600;
  font-style:normal;
  font-display:swap;
}




*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html,
body{
  width:100%;
  overflow-x:hidden;
  scroll-behavior:smooth;
}

body{
  background:var(--dark);
  color:var(--ink);
  font-family:"Inter",sans-serif;
}

img,
video{
  display:block;
  max-width:100%;
}

a{
  color:inherit;
  text-decoration:none;
}

/* HEADER */

.li-header{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:86px;
  z-index:9999;

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

  padding:0 42px;

  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;

  border-bottom:1px solid transparent;

  transition:
    height .45s ease,
    background .45s ease,
    border-color .45s ease,
    backdrop-filter .45s ease,
    -webkit-backdrop-filter .45s ease;
}

.li-header.is-scrolled,
.li-header.menu-is-open{
  height:76px;
  background:var(--menu-bg);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border-bottom:1px solid rgba(0,0,0,.08);
}

.li-header:not(.is-scrolled):not(.menu-is-open) .logo-icon img,
.li-header:not(.is-scrolled):not(.menu-is-open) .logo-text img{
  filter:brightness(0) invert(1);
}

.li-header:not(.is-scrolled):not(.menu-is-open) .mail-btn,
.li-header:not(.is-scrolled):not(.menu-is-open) .menu-btn{
  color:var(--white);
  border-color:rgba(244,239,228,.28);
  background:rgba(244,239,228,.06);
}

.li-header:not(.is-scrolled):not(.menu-is-open) .mail-btn:hover,
.li-header:not(.is-scrolled):not(.menu-is-open) .menu-btn:hover{
  background:var(--white);
  color:var(--black);
}

.logo{
  display:flex;
  align-items:center;
  gap:14px;
}

.logo-icon{
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

.logo-icon img{
  width:100%;
  height:100%;
  object-fit:contain;
  transition:transform .7s cubic-bezier(.22,1,.36,1), filter .35s ease;
}

.li-header.is-scrolled .logo-icon img{
  transform:rotate(90deg);
}

.logo-text img{
  width:170px;
  height:auto;
  display:block;
  transition:filter .35s ease;
}

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

.mail-btn,
.menu-btn{
  width:48px;
  height:48px;
  border-radius:50%;
  border:1px solid rgba(0,0,0,.14);
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  color:#111;

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

  cursor:pointer;
  transition:
    background .35s ease,
    border-color .35s ease,
    color .35s ease,
    transform .35s ease;
}

.li-header.is-scrolled .mail-btn,
.li-header.is-scrolled .menu-btn,
.li-header.menu-is-open .mail-btn,
.li-header.menu-is-open .menu-btn{
  background:rgba(255,255,255,.38);
  border-color:rgba(0,0,0,.12);
}

.mail-btn{
  font-size:20px;
}

.mail-btn:hover,
.menu-btn:hover{
  background:#111;
  border-color:#111;
  color:var(--white);
  transform:translateY(-2px);
}

.menu-btn{
  flex-direction:column;
  gap:7px;
  position:relative;
  z-index:10001;
}

.menu-btn span{
  width:21px;
  height:1px;
  background:currentColor;
  transition:transform .35s ease, opacity .35s ease;
}

.menu-btn.is-active span:nth-child(1){
  transform:translateY(4px) rotate(45deg);
}

.menu-btn.is-active span:nth-child(2){
  transform:translateY(-4px) rotate(-45deg);
}






.header-section-label{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:#171713;
  opacity:.55;
  pointer-events:none;
  white-space:nowrap;
}

.header-section-label.is-changing{
  opacity:0;
  transform:translate(-50%,-40%);
}

@media(max-width:768px){
  .header-section-label{
    display:none;
  }
}








/* MENU OVERLAY */

.menu-overlay{
  position:fixed;
  inset:0;
  z-index:9998;
  pointer-events:none;
}

.menu-overlay.is-open{
  pointer-events:auto;
}

.menu-blinds{
  position:absolute;
  inset:0;
  display:grid;
  grid-template-rows:repeat(8,1fr);
  gap:0;
  background:transparent;
}

.menu-blinds span{
  display:block;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  outline:0;
  box-shadow:none;

  background:var(--menu-bg);

  transform:scaleY(0);
  transform-origin:top;
  will-change:transform;
}

.menu-blinds span:nth-child(even){
  background:var(--menu-bg);
}

.menu-inner{
  position:relative;
  z-index:2;
  height:100vh;

  display:grid;
  grid-template-columns:1.05fr .95fr;

  opacity:0;
  visibility:hidden;
}

.menu-left{
  height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-left:8vw;
}

.menu-content{
  display:flex;
  flex-direction:column;
  gap:0;
}

.menu-content a{
  color:#11100e;
  font-family:"Canela",serif;
  font-size:clamp(54px,5.6vw,104px);
  line-height:.92;
  letter-spacing:-.045em;

  opacity:0;
  transform:translateY(40px);

  padding:7px 0;
  border-bottom:1px solid rgba(17,16,14,.12);

  transition:color .35s ease, padding-left .35s ease;
}

.menu-content a:hover{
  color:var(--brown);
  padding-left:14px;
}

.menu-right{
  border-left:1px solid rgba(17,16,14,.12);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:7vw;
}

.quote-box{
  max-width:520px;
  color:#11100e;
}

.quote-symbol{
  width:42px;
  margin-bottom:40px;
  opacity:.85;
}

.quote-text{
  font-family:"Canela",serif;
  font-size:clamp(34px,4vw,64px);
  line-height:1;
  letter-spacing:-.035em;
}

.quote-author{
  margin-top:28px;
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:rgba(17,16,14,.56);
}

.menu-social{
  position:absolute;
  right:7vw;
  bottom:44px;
  left:auto;
  transform:none;
  z-index:3;

  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:18px;

  opacity:0;
  visibility:hidden;
}

.menu-social-line{
  width:220px;
  height:1px;
  background:rgba(17,16,14,.22);
}

.menu-social-icons{
  display:flex;
  gap:18px;
}

.menu-social-icons a{
  color:#11100e;
  font-size:19px;
}

/* PAGE */

.legacy-page{
  width:100%;
  overflow:hidden;
  padding-top:120px;
  padding-bottom:80px;
}

.legacy-grid-row{
  width:min(1400px,92%);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:var(--gap);
  padding:var(--gap) 0;
}

.legacy-card{
  position:relative;
  overflow:hidden;
  min-height:560px;
}

.cream{ background:var(--cream); color:var(--ink); }
.sage{ background:var(--sage); color:var(--white); }
.brown{ background:var(--brown); color:var(--white); }



.li-bg-card{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.li-bg-card::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--bg);
  background-size:cover;
  background-position:center;
  opacity:.30;
  transition:all .7s cubic-bezier(.22,1,.36,1);
  z-index:-2;
}

.li-bg-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(241,239,227,.82);
  transition:all .7s cubic-bezier(.22,1,.36,1);
  z-index:-1;
}

.li-bg-card:hover::before{
  opacity:1;
  transform:scale(1.05);
}

.li-bg-card:hover::after{
  background:rgba(241,239,227,0);
}

.li-bg-card h3,
.li-bg-card span{
  transition:all .45s ease;
  color: var(--ink);
}


.li-bg-card p{
  transition:all .45s ease;
  color: var(--ink);
  line-height: 1.35rem !important;
}

.li-bg-card:hover h3,
.li-bg-card:hover p,
.li-bg-card:hover span{
  color:#fff;
  text-shadow:0 2px 12px rgba(0,0,0,.35);
}

/* INTRO */

.hero-card{
  padding:60px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.brand-logo-main{
  width:260px;
}

.hero-card h1{
  color:var(--white);
  font-size:clamp(62px,6.6vw,112px);
  line-height:.88;
  letter-spacing:-.06em;
}

.hero-card p{
  font-size:12px;
  letter-spacing:.24em;
  text-transform:uppercase;
}

.intro-image-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.intro-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.12));
}

.intro-copy{
  position:absolute;
  left:48px;
  bottom:48px;
  z-index:2;
  max-width:520px;
}

.intro-copy span{
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:rgba(255,255,255,.7);
}

.intro-copy h2{
  margin-top:18px;
  font-family:"Canela",serif;
  font-size:clamp(34px,3vw,64px);
  line-height:.98;
  font-weight:400;
  letter-spacing: -0.03em;
}

.intro-copy a{
  display:inline-block;
  margin-top:34px;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
}

/* HORIZONTAL */

.horizontal-section{
  position:relative;
  width:100%;
  height:100vh;
  overflow:hidden;
}

.horizontal-track{
  display:flex;
  align-items:stretch;
  gap:var(--gap);
  width:max-content;
  height:100%;
  padding:var(--gap) 4vw;
}

.horizontal-track .legacy-card{
  width:620px;
  flex-shrink:0;
}

.editorial-card{
  padding:48px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.editorial-card h2{
  font-family:"Canela",serif;
  font-weight:400;
  font-size:clamp(42px,4vw,72px);
  line-height:.95;
  letter-spacing:-.04em;
  max-width:480px;
}

.editorial-card span,
.editorial-card p{
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.card-founder{
  padding:0;
}

.card-founder img,
.card-case img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.card-founder:after,
.card-case:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.6));
}

.card-founder h2{
  position:absolute;
  left:42px;
  bottom:42px;
  z-index:2;
  color:var(--white);
}

.card-side-text{
  position:absolute;
  left:34px;
  top:100px;
  z-index:2;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  color:var(--white);
  font-size:12px;
  letter-spacing:.24em;
  text-transform:uppercase;
}

.card-bottom{
  position:absolute;
  left:42px;
  bottom:42px;
  top: 100px;
  z-index:2;
  max-width:480px;
}

.pattern-symbol{
  display:flex;
  justify-content:center;
  align-items:center;
  height:55%;
}

.pattern-symbol img{
  width:150px;
  opacity:.85;
}

.card-network{
  background:
    radial-gradient(circle at 50% 45%, rgba(108,73,67,.08), transparent 30%),
    var(--cream);
}

.card-academy p{
  opacity:.72;
}

.card-enquiry{
  background:var(--cream);
}

/* FINAL ROW */

.logo-mask-card{
  background:#111;
}

.logo-mask-card video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.75;
}

.mask-layer{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(17,16,14,.35);
}

.mask-layer img{
  width:210px;
  filter:brightness(0) invert(1);
  opacity:.88;
  mix-blend-mode:screen;
}

.final-cta-card{
  padding:58px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.final-cta-card span{
  font-size:12px;
  letter-spacing:.2em;
  text-transform:uppercase;
}

.final-cta-card h2{
  font-family:"Canela",serif;
  font-size:clamp(44px,3vw,82px);
  line-height:.98;
  font-weight:400;
  letter-spacing: -0.03;
}

.final-cta-card a{
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
}

/* FOOTER */

.li-footer{
  width:min(1400px,92%);
  margin:0 auto;
  padding:52px 0 80px;
  border-top:1px solid rgba(255,255,255,.09);
  color:rgba(255,255,255,.56);

  display:flex;
  justify-content:space-between;
  gap:32px;
}

.footer-brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.footer-brand img{
  width:28px;
  filter:brightness(0) invert(1);
  opacity:.8;
}

.footer-brand span,
.footer-links a,
.footer-copy{
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.footer-links{
  display:flex;
  gap:22px;
}

/* MOBILE */

@media(max-width:980px){

  .li-header{
    height:72px;
    padding:0 18px;
  }

  .li-header.is-scrolled,
  .li-header.menu-is-open{
    height:68px;
  }

  .logo-icon{
    width:38px;
    height:38px;
  }

  .logo-text img{
    width:132px;
  }

  .mail-btn,
  .menu-btn{
    width:44px;
    height:44px;
  }

  .legacy-page{
    padding-top:92px;
    padding-bottom:50px;
  }

  .legacy-grid-row{
    width:94%;
    grid-template-columns:1fr;
    gap:10px;
    padding:10px 0;
  }

  .legacy-card{
    min-height:430px;
  }

  .hero-card,
  .editorial-card,
  .final-cta-card{
    padding:34px;
  }

  .brand-logo-main{
    width:190px;
  }

  .hero-card h1{
    font-size:58px;
  }

  .intro-copy{
    left:32px;
    bottom:32px;
    max-width:310px;
  }

  .intro-copy h2{
    font-size:2rem;
  }

  .horizontal-section{
    height:auto;
    overflow:visible;
  }

  .horizontal-track{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    padding:10px 3%;
    gap:10px;
  }

  .horizontal-track .legacy-card{
    width:100%;
  }

  .editorial-card h2,
  .final-cta-card h2{
    font-size:2rem;
  }

  .menu-blinds{
    grid-template-rows:repeat(8,1fr);
  }

  .menu-inner{
    display:block;
  }

  .menu-left{
    height:100vh;
    padding:0 26px;
    justify-content:center;
    align-items:flex-start;
  }

  .menu-content a{
    font-size:36px;
    line-height:40px;
    color:#11100e;
    border-bottom:0;
    padding:3px 0;
  }

  .menu-right{
    display:none;
  }

  .menu-social{
    left:50%;
    right:auto;
    bottom:30px;
    transform:translateX(-50%);
    align-items:center;
  }

  .menu-social-line{
    width:160px;
  }

  .li-footer{
    flex-direction:column;
    padding:44px 0 60px;
  }

  .footer-links{
    flex-direction:column;
    gap:12px;
  }

}


/* MENU OPEN ON TOP - CLOSE ICON BLACK */

.li-header.menu-is-open .menu-btn{
  color:#111 !important;
  border-color:rgba(0,0,0,.14) !important;
  background:rgba(255,255,255,.38) !important;
}

.li-header.menu-is-open .menu-btn span{
  background:#111 !important;
}



/* SHARED VIDEO BACKGROUND SLICES */

.video-slice{
  background:#111;
  color:var(--white);
}

.card-bg-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
}

.slice-left .card-bg-video{
  object-position:left center;
}

.slice-center .card-bg-video{
  object-position:center center;
}

.slice-right .card-bg-video{
  object-position:right center;
}

.card-video-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg, rgba(17,16,14,.12), rgba(17,16,14,.68)),
    rgba(40,35,29,.24);
}

.video-slice span,
.video-slice h2,
.video-slice p,
.video-slice .card-side-text,
.video-slice .card-bottom{
  position:relative;
  z-index:2;
}

.video-slice h2{
  color:var(--white);
}

.video-slice span,
.video-slice p,
.video-slice .card-side-text{
  color:rgba(244,239,228,.86);
}

.video-slice span{
  top: 100px;
}

/* GSAP HOVER REVEAL PATTERN */

.pattern-card{
  background:#6c4943;
  color:var(--white);
  overflow:hidden;
}
.animated-pattern{
  position:absolute;
  inset:-18%;
  z-index:0;

  display:flex;
  flex-direction:column;
  justify-content:center;

  gap:18px;

  opacity:1;
  pointer-events:none;
}

.animated-pattern .pattern-row{
  display:flex;
  gap:20px;
  white-space:nowrap;
}

.animated-pattern .pattern-row:nth-child(even){
  transform:translateX(32px);
}

.animated-pattern span{
  width:48px;
  height:48px;
  flex:0 0 48px;

  background:url("assets/LI-icon.svg") center/contain no-repeat;

  filter:brightness(0) invert(1);
  opacity:.015;

  transform:scale(.92);
  will-change:opacity, transform;
}

.pattern-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;

  background:linear-gradient(
    180deg,
    rgba(17,16,14,.04),
    rgba(17,16,14,.28)
  );

  pointer-events:none;
}







/* NETWORK CARD — MOUSE REVEAL NODES */

.network-card{
  position:relative;
  overflow:hidden;
  background:var(--cream);
  color:var(--ink);
}

.network-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
  pointer-events:none;
}

.network-card span,
.network-card h2{
  position:relative;
  z-index:2;
}


/* =========================================
   FOUNDER MASK CARD
========================================= */

.founder-mask-card {
  position: relative;
  overflow: hidden;
  background: #9da06b;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}

.founder-bg {
  position: absolute;
  inset: 0;

  background:
    radial-gradient(circle at 50% 30%,
      rgba(255,255,255,0.08),
      transparent 60%);

  z-index: 1;
}

.founder-letter-wrap {
  position: absolute;
  inset: 0;

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

  z-index: 2;
}

.founder-letter {
  position: absolute;

  font-family: "Canela", serif;
  font-size: 34vw;
  line-height: .8;
  font-weight: 600;

  color: rgba(255,255,255,0.08);

  transform: translateY(-2%);
  pointer-events: none;
}

.founder-person {
  position: absolute;

  width: 78%;
  max-width: 560px;

  bottom: -2%;
  left: 50%;

  transform: translateX(-50%);

  object-fit: contain;

  mix-blend-mode: lighten;

  filter:
    contrast(1.04)
    saturate(.9);

  z-index: 3;
}

.founder-gradient {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      to top,
      rgba(0,0,0,.32),
      rgba(0,0,0,.08) 45%,
      transparent 75%
    );

  z-index: 4;
}

.founder-content {
  position: relative;
  z-index: 6;

  padding: 3vw;
}

.founder-mask-card h2 {
  position: relative;
  z-index: 10;
}

/* HOVER */

.founder-mask-card:hover .founder-person {
  transform:
    translateX(-50%)
    scale(1.03);

  transition: 1.2s cubic-bezier(.19,1,.22,1);
}

.founder-mask-card:hover .founder-letter {
  transform:
    translateY(-2%)
    scale(1.04);

  opacity: .12;

  transition: 1.2s cubic-bezier(.19,1,.22,1);
}



/* =========================================
   ACADEMY MASK CARD
========================================= */

.academy-mask-card{
  position:relative;
  overflow:hidden;
  background:#9da06b;

  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
}

.academy-bg{
  position:absolute;
  inset:0;

  background:
    radial-gradient(
      circle at 50% 30%,
      rgba(255,255,255,0.08),
      transparent 60%
    );

  z-index:1;
}

.academy-letter-wrap{
  position:absolute;
  inset:0;

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

  z-index:2;
  pointer-events:none;
}

.academy-letter{
  position:absolute;

  font-family:"Canela", serif;
  font-size:34vw;
  line-height:.8;
  font-weight:600;

  color:rgba(255,255,255,0.045);

  transform:
    translateY(3%)
    scale(.92);

  transition:
    transform 1.4s cubic-bezier(.19,1,.22,1),
    opacity 1.4s cubic-bezier(.19,1,.22,1),
    filter 1.4s cubic-bezier(.19,1,.22,1),
    color 1.4s cubic-bezier(.19,1,.22,1);

  filter:blur(0px);

  will-change:transform;
}

.academy-gradient{
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      to top,
      rgba(0,0,0,.22),
      rgba(0,0,0,.04) 45%,
      transparent 75%
    );

  z-index:3;
}

.academy-content{
  position:relative;
  z-index:5;

  padding:3vw;

  transition:
    transform 1s cubic-bezier(.19,1,.22,1);
}

.academy-mask-card h2,
.academy-mask-card span,
.academy-mask-card p{
  position:relative;
  z-index:6;
}

/* =========================================
   HOVER
========================================= */

.academy-mask-card:hover .academy-letter{

  color:rgba(255,255,255,0.12);

  transform:
    translateY(0%)
    scale(1.08);

  filter:blur(.3px);
}

.academy-mask-card:hover .academy-content{
  transform:translateY(-10px);
}






/* =========================================
   LEGACY BUTTON
========================================= */

.li-btn{
  position:relative;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;

  padding:15px 24px;

  overflow:hidden;
  isolation:isolate;

  border:1px solid rgba(244,239,228,.35);
  border-radius:0;

  background:transparent;

  pointer-events:none;

  min-width:140px;
}



/* TEXT */

.li-btn span{
  position:relative;
  z-index:5;

  color:var(--white);

  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;

  transition:color .45s ease;
}

/* ICON */

.li-btn img{
  position:relative;
  z-index:5;

  width:12px;
  height:auto;

  transition:
    transform .45s cubic-bezier(.19,1,.22,1),
    filter .45s ease;
}

/* SPLIT BLINDS */

.li-btn::before,
.li-btn::after{
  content:"";

  position:absolute;
  top:0;

  width:50%;
  height:100%;

  background:var(--cream);

  z-index:1;

  transition:
    transform .65s cubic-bezier(.19,1,.22,1);
}

/* LEFT */

.li-btn::before{
  left:0;

  transform:translateY(-100%);
}

/* RIGHT */

.li-btn::after{
  right:0;

  transform:translateY(100%);
}

/* HOVER */

.legacy-card:hover .li-btn::before,
.legacy-card:hover .li-btn::after{
  transform:translateY(0%);
}

.legacy-card:hover .li-btn span{
  color:var(--black);
}

.legacy-card:hover .li-btn img{
  transform:translateX(4px);
  filter:invert(1);
}

/* LIGHT VERSION */

.li-btn-dark{
  border-color:rgba(17,16,14,.24);
}

.li-btn-dark span{
  color:var(--black);
}

.li-btn-dark::before,
.li-btn-dark::after{
  background:var(--black);
}

.legacy-card:hover .li-btn-dark span{
  color:var(--white);
}

.legacy-card:hover .li-btn-dark img{
  filter:invert(1);
}




/* LIGHT BACKGROUND BUTTON */

.li-btn2{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:15px 24px;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(40,35,29,.35);
  border-radius:0;
  background:transparent;
  pointer-events:none;
  min-width:140px;
}

.li-btn2 span{
  position:relative;
  z-index:5;
  color:var(--black);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  transition:color .45s ease;
}

.li-btn2 img{
  position:relative;
  z-index:5;
  width:12px;
  height:auto;
  transition:
    transform .45s cubic-bezier(.19,1,.22,1),
    filter .45s ease;
}

.li-btn2::before,
.li-btn2::after{
  content:"";
  position:absolute;
  top:0;
  width:50%;
  height:100%;
  background:var(--black);
  z-index:1;
  transition:transform .65s cubic-bezier(.19,1,.22,1);
}

.li-btn2::before{
  left:0;
  transform:translateY(-100%);
}

.li-btn2::after{
  right:0;
  transform:translateY(100%);
}

.legacy-card:hover .li-btn2::before,
.legacy-card:hover .li-btn2::after{
  transform:translateY(0%);
}

.legacy-card:hover .li-btn2 span{
  color:var(--white);
}

.legacy-card:hover .li-btn2 img{
  transform:translateX(4px);
  filter:invert(1);
}


/* =========================
   INSIGHTS DIAGRAM EFFECT
========================= */

.card-insights{
  position:relative;
  overflow:hidden;
}

.insights-diagram{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;

  opacity:0;
  transform:scale(1.04);

  transition:
    opacity .8s ease,
    transform 1.2s cubic-bezier(.19,1,.22,1);
}

.insights-diagram svg{
  width:100%;
  height:100%;
}

/* LINES */

.insights-diagram line{
  stroke:rgba(255,255,255,.10);
  stroke-width:1;

  fill:none;

  stroke-dasharray:400;
  stroke-dashoffset:400;

  transition:stroke-dashoffset 2s cubic-bezier(.19,1,.22,1);
}

/* CIRCLES */

.insights-diagram circle{
  fill:rgba(255,255,255,.14);

  opacity:0;
  transition:opacity .8s ease .2s;
}

/* RECTANGLES */

.insights-diagram rect{
  fill:rgba(255,255,255,.04);
  stroke:rgba(255,255,255,.08);
  stroke-width:1;

  opacity:0;
  transform:translateY(20px);

  transition:
    opacity .8s ease .3s,
    transform 1s cubic-bezier(.19,1,.22,1);
}

/* TEXT */

.insights-diagram text{
  fill:rgba(255,255,255,.10);

  font-size:11px;
  letter-spacing:.18em;

  opacity:0;
  transition:opacity .8s ease .5s;
}

/* HOVER */

.card-insights:hover .insights-diagram{
  opacity:1;
  transform:scale(1);
}

.card-insights:hover .insights-diagram line{
  stroke-dashoffset:0;
}

.card-insights:hover .insights-diagram circle{
  opacity:1;
}

.card-insights:hover .insights-diagram rect{
  opacity:1;
  transform:translateY(0);
}

.card-insights:hover .insights-diagram text{
  opacity:1;
}

/* TEXT ABOVE SVG */

.card-insights span,
.card-insights h2{
  position:relative;
  z-index:3;
}











.enquiry-card{
  position:relative;
  overflow:hidden;
}

.enquiry-marquee{
  position:absolute;
  inset:0;
  z-index:1;
  display:flex;
  align-items:center;
  pointer-events:none;
  opacity:.35;
  transition:opacity .9s ease;
}

.enquiry-marquee-track{
  display:flex;
  width:max-content;
  animation:enquiryMarquee 18s linear infinite;
}

.enquiry-marquee span{
  font-family:"Canela", serif;
  font-size:clamp(120px,13vw,230px);
  line-height:.8;
  letter-spacing:-.06em;
  color:rgba(17,16,14,.045);
  padding-right:.25em;
  white-space:nowrap;
}

@keyframes enquiryMarquee{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

.enquiry-label,
.enquiry-title,
.enquiry-link{
  position:relative;
  z-index:3;
}



/* FIX ENQUIRY TYPE TEXT SIZE */

.enquiry-title{
  display:block !important;
  max-width:86% !important;
}

.enquiry-title .static-text,
.enquiry-title .typing-text{
  display:inline !important;
  font-family:inherit !important;
  font-size:inherit !important;
  line-height:inherit !important;
  letter-spacing:inherit !important;
}

.typing-text::after{
  content:"";
  display:inline-block;
  width:1px;
  height:.75em;
  margin-left:3px;
  background:currentColor;
  opacity:0;
}

.enquiry-card.is-typing .typing-text::after{
  opacity:1;
  animation:cursorBlink .8s infinite;
}

@keyframes cursorBlink{
  0%,50%{opacity:1;}
  51%,100%{opacity:0;}
}













/* =========================================
   MENU SUBLINKS — DESKTOP + MOBILE
========================================= */

.menu-item{ opacity:0; transform:translateY(40px); }

.menu-main-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid rgba(17,16,14,.12);
}

.menu-main-row .main-menu-link{
  display:block;
  flex:1;
  color:#11100e;
  font-family:"Canela",serif;
  font-size:clamp(54px,5.6vw,104px);
  line-height:.92;
  letter-spacing:-.045em;
  opacity:1;
  transform:none;
  padding:7px 0;
  border-bottom:0;
  transition:color .35s ease, padding-left .35s ease;
}

.menu-item:hover .main-menu-link{ color:var(--brown); padding-left:14px; }
.mobile-sub-toggle{ display:none; }
.mobile-subnav{ display:none; }
.menu-right{ position:relative; }

.menu-sub-panel{
  position:absolute;
  left:7vw;
  right:7vw;
  top:15%;
  transform:translateY(-50%);
  opacity:0;
  visibility:hidden;
  color:#11100e;
  pointer-events:none;
}

.menu-sub-panel.is-active{ visibility:visible; pointer-events:auto; }

.menu-sub-eyebrow{
  margin-bottom:22px;
  font-size:11px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:rgba(17,16,14,.52);
}

.menu-sub-panel h3{
  max-width:560px;
  margin-bottom:42px;
  font-family:"Canela",serif;
  font-size:clamp(34px,3.3vw,58px);
  line-height:.96;
  letter-spacing:-.04em;
  font-weight:400;
}

.menu-sub-links{ display:flex; flex-direction:column; max-width:680px; }

.menu-sub-links a{
  display:flex;
  align-items:baseline;
  gap:18px;
  padding:17px 0;
  border-bottom:1px solid rgba(17,16,14,.12);
  font-family:"Canela",serif;
  font-size:clamp(28px,2.35vw,46px);
  line-height:1;
  letter-spacing:-.035em;
  opacity:1;
  transform:none;
  transition:color .35s ease, padding-left .35s ease;
}

.menu-sub-links a span{
  min-width:26px;
  font-family:"Inter",sans-serif;
  font-size:10px;
  letter-spacing:.2em;
  color:rgba(17,16,14,.45);
}

.menu-sub-links a:hover{ color:var(--brown); padding-left:12px; }

@media(max-width:980px){
  .menu-left{
    justify-content:flex-start;
    padding-top:112px;
    padding-bottom:120px;
    overflow-y:auto;
  }
  .menu-content{ width:100%; }
  .menu-item{ width:100%; }
  .menu-main-row{ width:100%; border-bottom:1px solid rgba(17,16,14,.10); }
  .menu-main-row .main-menu-link{
    font-size:42px;
    line-height:1;
    padding:10px 0;
    border-bottom:0;
  }
  .menu-item:hover .main-menu-link{ padding-left:0; }
  .mobile-sub-toggle{
    display:flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border:1px solid rgba(17,16,14,.14);
    border-radius:50%;
    background:transparent;
    color:#11100e;
    font-family:"Inter",sans-serif;
    font-size:22px;
    line-height:1;
    cursor:pointer;
    flex-shrink:0;
  }
  .mobile-subnav{
    display:grid;
    grid-template-rows:0fr;
    overflow:hidden;
    transition:grid-template-rows .45s cubic-bezier(.19,1,.22,1);
  }
  .mobile-subnav a{
    display:block;
    min-height:0;
    padding:0 0 0 18px;
    border-bottom:0;
    font-family:"Inter",sans-serif;
    font-size:11px;
    line-height:1.2;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:rgba(17,16,14,.62);
    opacity:0;
    transform:translateY(-4px);
    transition:opacity .35s ease, transform .35s ease, padding .35s ease, color .35s ease;
  }
  .menu-item.is-mobile-open .mobile-subnav{
    grid-template-rows:1fr;
    padding:10px 0 16px;
  }
  .menu-item.is-mobile-open .mobile-subnav a{
    opacity:1;
    transform:translateY(0);
    padding:9px 0 9px 18px;
  }
  .mobile-subnav a:hover{ color:var(--brown); }
}


@media(max-width:980px){
  .mobile-subnav{
    display:none !important;
  }

  .menu-item.is-mobile-open .mobile-subnav{
    display:flex !important;
    flex-direction:column;
    gap:10px !important;
    padding:12px 0 22px 22px !important;
  }

  .mobile-subnav a{
    font-family:"Inter",sans-serif !important;
    font-size:12px !important;
    line-height:1.65 !important;
    letter-spacing:.18em !important;
    text-transform:uppercase !important;
    padding:0 !important;
    border:0 !important;
    opacity:.74 !important;
    color:rgba(17,16,14,.68) !important;
  }
}



.menu-blinds{
  overflow:hidden;
}

.menu-blinds span{
  width:calc(100% + 2px);
  margin-left:-1px;
  margin-right:-1px;
  outline:1px solid var(--menu-bg);
}


/* =========================================================
   SHARED EXPERTISE LIST + MODAL
========================================================= */

.expertise-list{
  display:flex;
  flex-direction:column;
}

.expertise-link{
  width:100%;
  border:0;
  border-bottom:1px solid rgba(17,16,14,.12);
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:22px 0;
  cursor:pointer;
  text-align:left;
  color:var(--ink);
  font-family:"Canela",serif;
  font-size:clamp(28px,3vw,52px);
  line-height:1;
  letter-spacing:-.04em;
}

.expertise-text{
  display:flex;
  align-items:center;
  gap:18px;
}

.expertise-icon{
  width:18px;
  height:18px;
  object-fit:contain;
  opacity:0;
  transform:scale(.4) rotate(-45deg);
  transition:opacity .35s ease, transform .35s ease;
}

.expertise-arrows{
  display:flex;
  gap:4px;
  opacity:0;
  transform:translateX(-12px);
  transition:opacity .35s ease, transform .35s ease;
}

.expertise-arrows img{
  width:15px;
  height:15px;
  animation:expertiseArrowMove 1s ease-in-out infinite;
}

.expertise-arrows img:nth-child(2){ animation-delay:.12s; }
.expertise-arrows img:nth-child(3){ animation-delay:.24s; }

.expertise-link:hover,
.expertise-link.active{
  color:var(--brown);
}

.expertise-link:hover .expertise-icon,
.expertise-link.active .expertise-icon{
  opacity:1;
  transform:scale(1) rotate(0deg);
}

.expertise-link:hover .expertise-arrows,
.expertise-link.active .expertise-arrows{
  opacity:1;
  transform:translateX(0);
}

@keyframes expertiseArrowMove{
  0%,100%{ transform:translateX(0); opacity:.35; }
  50%{ transform:translateX(6px); opacity:1; }
}

/* MODAL */

.expertise-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  pointer-events:none;
  opacity:0;
  transition:opacity .35s ease;
}

.expertise-modal.is-open{
  pointer-events:auto;
  opacity:1;
}

.expertise-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(17,16,14,.72);
  backdrop-filter:blur(8px);
}

.expertise-modal-panel{
  position:absolute;
  right:5vw;
  top:50%;
  transform:translateY(-46%) scale(.96);
  width:min(720px,90vw);
  min-height:520px;
  background:var(--cream);
  color:var(--ink);
  padding:64px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  transition:transform .45s cubic-bezier(.22,1,.36,1);
}

.expertise-modal.is-open .expertise-modal-panel{
  transform:translateY(-50%) scale(1);
}

.expertise-modal-close{
  position:absolute;
  right:28px;
  top:24px;
  width:48px;
  height:48px;
  border:1px solid rgba(17,16,14,.16);
  border-radius:50%;
  background:transparent;
  font-size:34px;
  line-height:1;
  cursor:pointer;
}

.expertise-modal-label{
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  opacity:.62;
  margin-bottom:32px;
}

.expertise-modal-panel h2{
  font-family:"Canela",serif;
  font-size:clamp(44px,5vw,86px);
  line-height:.92;
  letter-spacing:-.055em;
  font-weight:400;
  margin-bottom:34px;
}

.expertise-modal-panel p{
  font-size:16px;
  line-height:1.9;
  opacity:.75;
  max-width:560px;
}

@media(max-width:980px){
  .expertise-link{
    font-size:30px;
    padding:18px 0;
  }

  .expertise-modal-panel{
    left:50%;
    right:auto;
    top:50%;
    transform:translate(-50%,-46%) scale(.96);
    padding:38px;
    min-height:460px;
  }

  .expertise-modal.is-open .expertise-modal-panel{
    transform:translate(-50%,-50%) scale(1);
  }
}

/* =========================================================
   ACCESSIBILITY — REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}


/* =========================================================
   MENU VISIBILITY FIX
========================================================= */

.menu-overlay {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.menu-overlay.active {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.menu-overlay .menu-blinds {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.menu-overlay .menu-inner {
  position: relative;
  z-index: 5;
  opacity: 0;
  visibility: hidden;
}

.menu-overlay .menu-social {
  position: relative;
  z-index: 5;
  opacity: 0;
  visibility: hidden;
}

.menu-overlay.active .menu-inner,
.menu-overlay.active .menu-social {
  opacity: 1;
  visibility: visible;
}

.menu-overlay.active .menu-content,
.menu-overlay.active .menu-right,
.menu-overlay.active .quote-box {
  visibility: visible;
  opacity: 1;
}


/* =========================================================
   MENU LEFT SIDE VISIBILITY FIX
========================================================= */

.menu-overlay.active .menu-left,
.menu-overlay.active .menu-content,
.menu-overlay.active .menu-item,
.menu-overlay.active .menu-main-row,
.menu-overlay.active .main-menu-link {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

.menu-overlay .menu-left {
  position: relative;
  z-index: 10;
}

.menu-overlay .menu-content {
  display: flex;
  flex-direction: column;
  opacity: 1;
  visibility: visible;
}

.menu-overlay .menu-item {
  opacity: 1;
  visibility: visible;
}

.menu-overlay .main-menu-link {
  opacity: 1;
  visibility: visible;
}

/* =========================================================
   CURRENT HEADER / MENU JS COMPATIBILITY
========================================================= */

.menu-overlay.active,
.menu-overlay.is-open {
  pointer-events: auto;
}

.menu-overlay.active .menu-inner,
.menu-overlay.is-open .menu-inner,
.menu-overlay.active .menu-social,
.menu-overlay.is-open .menu-social {
  visibility: visible;
}

.menu-btn.active span:nth-child(1),
.menu-btn.is-active span:nth-child(1) {
  transform: translateY(4px) rotate(45deg);
}

.menu-btn.active span:nth-child(2),
.menu-btn.is-active span:nth-child(2) {
  transform: translateY(-4px) rotate(-45deg);
}

.header-section-label {
  opacity: 0;
  transition:
    opacity 0.3s ease,
    transform 0.3s ease;
}

.header-section-label.visible {
  opacity: 0.55;
}

body.menu-open .li-header {
  height: 76px;
  background: var(--menu-bg);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border-bottom-color: rgba(0, 0, 0, 0.08);
}

body.menu-open .li-header .logo-icon img,
body.menu-open .li-header .logo-text img {
  filter: none;
}

body.menu-open .li-header .mail-btn,
body.menu-open .li-header .menu-btn {
  color: var(--black);
  border-color: rgba(0, 0, 0, 0.14);
  background: rgba(255, 255, 255, 0.38);
}