/* =====================================================
   MAYKE — GLOBAL SYSTEM
   ===================================================== */

:root{
  --cream:  #EBDAC6;
  --paper:  #F7F1E6;
  --ink:    #2F3432;
  --muted:  #726B64;
  --accent: #E18261;
  --divider:#E6D8C8;
  --honey:  #FFCA8C;

  --weight-light: 250;
  --weight-regular: 300;
  --weight-medium: 350;
  --weight-heading: 380;

  --max: 1320px;
  --pad: clamp(.85rem, 2vw, 1.4rem);

  --serif: "Libre Baskerville", Georgia, serif;
  --sans: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;

  --ease: cubic-bezier(.16,1,.3,1);
  --radius: 0px;
  --line: 1px solid var(--divider);
}

*,
*::before,
*::after{ box-sizing:border-box; }

html,
body{
  margin:0;
  padding:0;
  overscroll-behavior-y:none;
}

html{ scroll-behavior:smooth; }

body{
  font-family:var(--sans);
  background:var(--cream);
  color:var(--ink);
  line-height:1.55;
  letter-spacing:.01em;
  font-weight:var(--weight-light);
}

a{ color:inherit; }
a:hover{ color:var(--ink); }

h1, h2, h3{
  font-weight:var(--weight-heading);
}

.container{
  width:min(var(--max), 100%);
  margin-inline:auto;
  padding-inline:var(--pad);
}

/* =====================================================
   A11Y
   ===================================================== */

.skip-link{
  position:absolute;
  left:-999px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden;
}

.skip-link:focus{
  position:fixed;
  left:var(--pad);
  top:var(--pad);
  width:auto;
  height:auto;
  background:var(--ink);
  color:var(--paper);
  padding:.6rem .9rem;
  z-index:1000;
}

/* =====================================================
   HEADER / NAV
   ===================================================== */

.site-header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:50;
  background:var(--divider);
  backdrop-filter:blur(10px);
  border-bottom:.5px solid #000;
  transition:transform 700ms var(--ease), opacity 700ms var(--ease);
}

.site-header.is-hidden{
  opacity:0;
  transform:translateY(-110%);
  pointer-events:none;
}

.header-inner{
  height:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}

.nav-brand{
  display:flex;
  align-items:center;
  line-height:0;
}

.nav-logo{
  height:34px;
  width:auto;
  max-width:120px;
  display:block;
}

.site-nav ul,
.site-nav .nav-list{
  list-style: none;
  display: flex;
  align-items: center;
  gap: 3rem;
  margin: 0;
  padding: 0;
}

.site-nav a,
.site-nav .btn,
.site-nav .nav-cta{
  position:relative;
  display:inline-flex;
  align-items:center;
  line-height:1;
  text-decoration:none;
  font-size:.92rem;
  color:var(--muted);
}

.site-nav a:hover{ color:var(--muted); }

.site-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-4px;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .18s ease;
}

.site-nav a:hover::after,
.site-nav a[aria-current="page"]::after{
  transform:scaleX(1);
}

.nav-toggle{
  display:none;
  width:44px;
  height:44px;
  background:transparent;
  border:1px solid var(--divider);
  border-radius:var(--radius);
  cursor:pointer;
  position:relative;
}

.nav-toggle span{
  position:absolute;
  left:12px;
  right:12px;
  height:2px;
  background:var(--ink);
  transition:transform 300ms var(--ease), top 300ms var(--ease);
}

.nav-toggle span:first-child{ top:17px; }
.nav-toggle span:last-child{ top:25px; }

body.nav-open .nav-toggle span:first-child{
  top:21px;
  transform:rotate(45deg);
}

body.nav-open .nav-toggle span:last-child{
  top:21px;
  transform:rotate(-45deg);
}

@media (max-width: 820px){
  .nav-toggle{ display:block; }

  .site-nav{
    position:absolute;
    inset:64px 0 auto 0;
    background:var(--divider);
    border-bottom: 1px solid rgba(0,0,0,.18);
    display:none;
  }

  body.nav-open .site-nav{ display:block; }

  .site-nav ul,
  .site-nav .nav-list{
    flex-direction: column;
    align-items: flex-start;
    gap: .8rem;
    margin: 0;
    padding: 1rem var(--pad);
  }

  .site-nav li{
    margin: 0;
    padding: 0;
  }
}

/* =====================================================
   HERO
   ===================================================== */

.hero{
  position:relative;
  height:100vh;
  min-height:560px;
  overflow:hidden;
  background:#000;
}

.hero-media{
  position:absolute;
  inset:0;
  z-index:0;
}

.hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.42));
  pointer-events:none;
}

.hero-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:1;
  opacity:1;
  filter:blur(0px) brightness(1);
  transition:opacity 2200ms ease, filter 2200ms ease;
  display:block;
}

.hero-still{
  position:absolute;
  inset:0;
  z-index:0;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:0;
  transform:scale(1.03);
  filter:blur(8px) brightness(1.03);
  transition:opacity 2200ms ease, transform 2600ms ease, filter 2200ms ease;
}

.hero.is-blending .hero-video{
  opacity:0.05;
  filter:blur(1px) brightness(0.95);
}

.hero.is-blending .hero-still{
  opacity:1;
  transform:scale(1);
  filter:blur(0px) brightness(1);
}

.hero.is-still .hero-video{
  opacity:0;
  filter:blur(2px) brightness(0.92);
}

.hero.is-still .hero-still{
  opacity:1;
  transform:scale(1);
  filter:blur(0px) brightness(1);
}

.hero-inner{
  position:relative;
  z-index:3;
  height:100%;
}

.hero-logo{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  z-index:10;
  width:clamp(180px, 30vw, 420px);
  height:auto;
  display:block;
}

.hero-scroll-cue{
  position:absolute;
  left:50%;
  bottom:26px;
  transform:translateX(-50%);
  border:none;
  background:transparent;
  color:#fff;
  font-size:24px;
  line-height:1;
  padding:6px;
  cursor:pointer;
  opacity:.72;
  transition:opacity 220ms ease, transform 220ms ease;
  z-index:4;
}

.hero-scroll-cue:hover{
  opacity:1;
  transform:translateX(-50%) translateY(2px);
}

.hero-scroll-cue:focus-visible{
  outline:2px solid #fff;
  outline-offset:4px;
}

.visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* =====================================================
   ABOUT
   ===================================================== */

.about-split.about-split--full{
  height:100vh;
  min-height:100vh;
  padding:0;
  margin:0;
  border-bottom:var(--line);
  background:var(--cream);
}

.about-split__inner,
.about-split--full .about-split__inner{
  height:100vh;
  min-height:100vh;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  align-items:stretch;
}

.about-split__copy,
.about-split--full .about-split__copy{
  height:100vh;
  min-height:100vh;
  display:flex;
  align-items:center;
  padding:clamp(5rem, 10vw, 7rem) clamp(4rem, 10vw, 8rem);
}

.about-split__copy-inner,
.about-split--full .about-split__copy-inner{
  width:100%;
  max-width:70ch;
}

.section-kicker{
  margin:0 0 1.2rem;
  font-size:.9rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
}

.subcopy p{
  margin:0 0 1.2rem;
  font-size:1.05rem;
  color:color-mix(in oklab, var(--ink) 82%, var(--muted));
}

.about-cap-link{
  position: relative;
  display: inline-block;
  margin-top: 1.2rem;

  font-size: 1rem;
  color: var(--muted);
  text-decoration: none;
}

/* underline */
.about-cap-link::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -4px;

  height: 1px;
  background: currentColor;

  transform: scaleX(0);
  transform-origin: left;   
  transition: transform .18s ease;
}

/* hover animation */
.about-cap-link:hover::after{
  transform: scaleX(1);
  transform-origin: left;
}

/* optional color change like nav */
.about-cap-link:hover{
  color: var(--muted);
}

.about-split__media,
.about-split--full .about-split__media{
  position:relative;
  height:100vh;
  min-height:100vh;
  overflow:hidden;
  border-left:var(--line);
  background:var(--paper);
}

.about-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

.about-split__media::after,
.about-split--full .about-split__media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(rgba(0,0,0,.08), rgba(0,0,0,.26));
}

.about-split__copy .btn{
  margin-top:1.8rem;
}

@media (max-width: 900px){
  .about-split,
  .about-split.about-split--full{
    height:auto !important;
    min-height:0 !important;
  }

  .about-split__inner,
  .about-split--full .about-split__inner{
    display:grid !important;
    grid-template-columns:1fr !important;
    height:auto !important;
    min-height:0 !important;
  }

  .about-split__copy,
  .about-split--full .about-split__copy{
    min-height: calc(100vh - 64px);
    display: flex;
    align-items: center;
    justify-content: flex-start; 

    padding: clamp(2rem, 5vw, 3rem) var(--pad) clamp(3rem, 6vw, 4rem);
  }

  .subcopy{
    display: flex;
    flex-direction: column;
    gap: 1.4rem; /* space between paragraphs + link */
  }

  .about-split__media,
  .about-split--full .about-split__media{
    position:relative !important;
    display:block !important;
    height:60vh !important;
    min-height:60vh !important;
    max-height:none !important;
    overflow:hidden !important;
    border-left:none !important;
    border-top:var(--line) !important;
  }

  .about-video{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    object-position:center !important;
    display:block !important;
  }
}

/* =====================================================
   GENERIC SECTIONS
   ===================================================== */

.section{
  padding:clamp(4rem, 7vw, 6rem) 0;
  border-bottom:var(--line);
  background:var(--cream);
}

.section.alt{
  background:var(--paper);
}

.lead{
  max-width:70ch;
  font-size:1.1rem;
  color:var(--muted);
  margin:.6rem 0 0;
}

.section-kicker{
  max-width: 1080px;  
  margin: 3rem auto 1rem;
  text-align: left;
}

.services-copy{
  max-width: 1080px;  
  margin: 1rem auto 0;
  text-align: left;
}

.services-copy p{
  margin-bottom: 1.1rem;
  font-size: 1.2rem;
  line-height: 1.7;
  font-size:1.05rem;
  color:color-mix(in oklab, var(--ink) 82%, var(--muted));
  
}

/* =====================================================
   BUTTONS
   ===================================================== */

.btn{
  display:inline-block;
  padding:.7rem 1.2rem;
  border:1px solid var(--divider);
  background:transparent;
  color:var(--ink);
  text-decoration:none;
  font-size:.92rem;
  border-radius:var(--radius);
}

.btn--ghost:hover{
  background:var(--ink);
  color:var(--paper);
}

.cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
  margin-top:1.2rem;
}

/* =====================================================
   REVEAL
   ===================================================== */

[data-reveal]{
  opacity:0;
  transform:translateY(16px);
  transition:opacity 900ms var(--ease), transform 900ms var(--ease);
}

[data-reveal].is-in{
  opacity:1;
  transform:translateY(0);
}

@media (prefers-reduced-motion: reduce){
  [data-reveal]{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
}

/* =====================================================
   NEXT STEPS
   ===================================================== */

.next-steps{
  position:relative;
  overflow:hidden;
  min-height:70vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#fff;
}

.next-steps::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(15, 14, 13, 0.55), rgba(15, 14, 13, 0.55)),
    var(--nextsteps-bg);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:0;
  transform:scale(1.04);
  transition:opacity 1200ms ease, transform 1400ms ease;
  z-index:0;
}

.next-steps.is-in::before{
  opacity:1;
  transform:scale(1);
}

.next-steps-inner{
  position:relative;
  z-index:1;
  max-width:56ch;
  margin:0 auto;
  text-align:center;
}

.next-steps .next-steps-actions{
  display:flex;
  justify-content:center;
  gap:.9rem;
  flex-wrap:wrap;
  margin-top:1.2rem;
}

.next-steps .btn,
.next-steps .btn--ghost{
  background:rgba(255,255,255,0.08);
  border:none;
  color:var(--divider);
  padding:.75rem 1.4rem;
  border-radius:0;
  font-weight:var(--weight-regular);
  letter-spacing:.02em;
  transition:background-color 320ms ease, opacity 320ms ease, transform 320ms ease;
  opacity:.85;
}

.next-steps .btn:hover,
.next-steps .btn--ghost:hover,
.next-steps .btn:focus-visible,
.next-steps .btn--ghost:focus-visible{
  opacity:1;
  background:rgba(255,255,255,0.14);
  transform:translateY(-1px);
}

.next-steps .btn:active,
.next-steps .btn--ghost:active{
  transform:translateY(0);
  opacity:.95;
}

.next-steps .btn:focus{
  outline:none;
}

.next-steps[data-reveal]{
  opacity:1;
  transform:none;
}

/* =====================================================
   FOOTER
   ===================================================== */

.site-footer{
  position: relative;
  padding: 2.6rem 0;
  background: var(--divider);
}

.site-footer::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(0,0,0,0.18);
}

.foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.2rem;
}

.foot-logo{
  height:31px;
}

.site-footer .foot-social,
.site-footer .foot-social ul,
.site-footer .foot-social ol{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:14px !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
}

.site-footer .foot-social a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:36px;
  height:36px;
  border:1px solid var(--divider);
  text-decoration:none;
  border-radius:var(--radius);
}

.site-footer .foot-social a:hover{
  background:color-mix(in oklab, var(--paper) 70%, transparent);
}

.foot-social svg{
  width:18px;
  height:18px;
  color:var(--ink);
}

.foot-meta{
  font-size:.85rem;
  color:var(--muted);
}

/* =====================================================
   TESTIMONIALS
   ===================================================== */

.t-section{
  background:var(--paper);
}

.testimonials .testimonials-head{
  margin-bottom:1.6rem;
}

.t-carousel{
  display:grid;
  grid-template-columns:64px 1fr 64px;
  align-items:center;
  gap:14px;
}

.t-viewport{
  overflow:hidden;
  width:100%;
}

.t-track{
  display:flex;
  will-change:transform;
  transform:translate3d(0,0,0);
  transition:transform 650ms cubic-bezier(.2,.8,.2,1);
}

.t-slide{
  flex:0 0 100%;
  padding:clamp(18px, 3vw, 34px) 0;
  text-align:center;
}

.t-quote{
  margin:0 auto 14px;
  max-width:60ch;
  color:var(--ink);
  font-family:var(--serif);
  font-weight:var(--weight-regular);
  font-size:clamp(1.1rem, 1.7vw, 1.45rem);
  line-height:1.4;
}

.t-meta{
  margin:0;
  color:var(--muted);
  font-size:.95rem;
  letter-spacing:.02em;
}

.testimonials .t-arrow{
  width:64px;
  height:64px;
  border:none;
  background:transparent;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:40px;
  line-height:1;
  color:var(--ink);
  opacity:.6;
  cursor:pointer;
  transition:opacity 260ms var(--ease), transform 260ms var(--ease);
}

.testimonials .t-arrow:hover{
  opacity:1;
  transform:translateY(-1px);
}

.testimonials .t-arrow:active{
  transform:translateY(0);
}

.testimonials .t-arrow:focus-visible{
  outline:2px solid currentColor;
  outline-offset:6px;
}

@media (max-width: 720px){
  .t-carousel{
    grid-template-columns:52px 1fr 52px;
  }

  .testimonials .t-arrow{
    width:52px;
    height:52px;
    font-size:34px;
  }
}

/* =====================================================
   CLIENTS
   ===================================================== */

.clients-gallery{
  padding:0;
  margin:0;
  padding-top:64px;
}

.clients-grid{
  width:100%;
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:0;
}

.client-tile{
  position:relative;
  overflow:hidden;
  display:block;
  aspect-ratio:1 / 1;
  background:rgba(0,0,0,0.06);
}

.client-video,
.client-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
}

.client-video{
  object-fit:cover;
  object-position:center;
  transform: scale(.8);
}

.client-img{
  object-position:center;
  transition:opacity 420ms var(--ease), transform 900ms var(--ease);
  transform:scale(1.01);
}

.client-img.is-default{
  opacity:1;
  object-fit:contain;
  padding:12%;
  background:transparent;
}

.client-jete .client-img.is-default{
  padding: 3%;        /* tighter than default */
  transform: scale(1.08);
}

.client-img.is-hover{
  opacity:0;
  object-fit:cover;
}

.client-tile:hover .client-img.is-default{ opacity:0; }
.client-tile:hover .client-img.is-hover{ opacity:1; }
.client-tile:hover .client-img{ transform:scale(1.03); }

.make-white{
  filter:brightness(0) invert(1);
}

@media (max-width: 900px){
  .clients-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

/* =====================================================
   INQUIRY
   ===================================================== */

.inquiry--bleed{
  position: relative;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
}

/* left half image */
.inquiry--bleed .inquiry-bg{
  position: absolute;
  inset: 0 50% 0 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 0;
}

.inquiry--bleed .inquiry-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(rgba(10,10,10,0.22), rgba(10,10,10,0.28));
  pointer-events:none;
}

/* right half panel */
.inquiry--bleed .inquiry-wrap{
  grid-column: 2;
  position: relative;
  z-index: 1;

  min-height: 100vh;
  padding: clamp(70px,7vw,110px) clamp(40px,6vw,80px);

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

  background: var(--cream);
  border-left: var(--line);
  color: var(--ink);
}

.inquiry--bleed .inquiry-kicker{
  margin: 0 0 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: 1rem;
}

.inquiry--bleed .inquiry-title{
  margin: 0 0 10px;
  font-family: var(--serif);
  font-size: clamp(2.2rem, 4vw, 3.25rem);
  line-height: 1.05;
}

.inquiry--bleed .inquiry-sub{
  margin: 0;
  max-width: 60ch;
  opacity: .9;
  font-size: 1.05rem;
}

.inquiry--bleed .inquiry-kicker,
.inquiry--bleed .inquiry-title,
.inquiry--bleed .inquiry-sub,
.inquiry--bleed label{
  color: var(--ink);
}

.hp{
  position:absolute;
  left:-9999px;
  opacity:0;
  width:0;
  height:0;
}

/* remove floating card look */
.inquiry--bleed .inquiry-form{
  margin-top: clamp(22px, 3vw, 34px);
  padding: 0;
  border: none;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.inquiry--bleed .inquiry-form .grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px 22px;
  margin-bottom: 18px;
}

.inquiry--bleed .inquiry-form .field{
  display:grid;
  gap:8px;
}

.inquiry--bleed .inquiry-form label{
  font-size:.9rem;
  font-weight:var(--weight-regular);
}

.inquiry--bleed .inquiry-form input,
.inquiry--bleed .inquiry-form textarea,
.inquiry--bleed .inquiry-form select{
  width:100%;
  color:var(--ink);
  background:transparent;
  border:none;
  border-bottom:1px solid rgba(0,0,0,.22);
  padding:14px 0;
  outline:none;
  transition:border-color 200ms ease;
}

.inquiry--bleed .inquiry-form textarea{
  min-height:160px;
  resize:vertical;
}

.inquiry--bleed .inquiry-form ::placeholder{
  color: rgba(0,0,0,.38);
}

.inquiry--bleed .inquiry-form input:focus,
.inquiry--bleed .inquiry-form textarea:focus,
.inquiry--bleed .inquiry-form select:focus{
  border-bottom-color: var(--ink);
}

.form-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:14px;
  flex-wrap:wrap;
}

.check{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--ink);
  font-size:.92rem;
  font-weight:var(--weight-light);
}

.check input{
  width:16px;
  height:16px;
  border:1px solid rgba(0,0,0,.3);
  border-radius:0;
  appearance:none;
  display:grid;
  place-items:center;
  background:transparent;
}

.check input:checked{
  background: rgba(0,0,0,.08);
}

.check input:checked::after{
  content:"";
  width:9px;
  height:9px;
  background: var(--ink);
}

.chic-submit{
  border:none;
  background: rgba(0,0,0,0.06);
  color:var(--ink);
  padding:12px 12px;
  margin-top:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:.85rem;
  opacity:.72;
  transition:opacity 220ms ease;
}

.chic-submit:hover,
.chic-submit:focus-visible{
  opacity:1;
}

.inquiry-form input::placeholder,
.inquiry-form textarea::placeholder{
  color: var(--ink);
  opacity: .45;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}

.inquiry-form input,
.inquiry-form textarea{
  font-family: var(--sans);
  font-weight: var(--weight-light);
  font-size: 1rem;
  line-height: 1.4;
}

.inquiry-form .error{
  color:var(--accent);
  font-size:.82rem;
  min-height:1em;
}

.form-success,
.form-failure{
  margin-top:14px;
  font-weight:var(--weight-light);
}

#form-status{
  margin-top: 1rem;
  font-size: .9rem;
  color: var(--muted);
}

@media (max-width: 900px){
  .inquiry--bleed{
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .inquiry--bleed .inquiry-bg{
    position: relative;
    inset: auto;
    min-height: 42vh;
  }

  .inquiry--bleed .inquiry-wrap{
    grid-column: auto;
    min-height: auto;
    padding: clamp(48px, 8vw, 72px) var(--pad);
    background: var(--cream);
  }

  .inquiry--bleed .inquiry-form .grid{
    grid-template-columns: 1fr;
  }
}

/* =====================================================
   CAPABILITIES
   ===================================================== */

.capabilities-split{
  height:100vh;
  background:var(--cream);
  overflow:hidden;
}

.capabilities-inner{
  display:grid;
  grid-template-columns:1fr 1fr;
  height:100vh;
}

.capabilities-media{
  position:relative;
  overflow:hidden;
  border-right:var(--line);
}

.capabilities-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.capabilities-media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.22));
}

.capabilities-copy{
  position:relative;
  height:100vh;
  overflow:hidden;
  padding:clamp(3rem, 6vw, 5rem) var(--pad);
}

.capabilities-copy-inner{
  position:relative;
  width:100%;
  max-width:620px;
  height:100%;
  margin:0 auto;
}

.capabilities-kicker{
  position:absolute;
  top:14vh;
  left:0;
  margin:0;
}

.capabilities-title{
  transition:opacity 320ms ease, transform 320ms ease;
}

.capabilities-title.is-hidden{
  opacity:0;
  transform:translateY(-10px);
}

.capabilities-stack{
  position:absolute;
  inset:0;
  overflow-y:auto;
  padding-top:28vh;
  padding-bottom:10vh;
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.capabilities-stack::-webkit-scrollbar{
  display:none;
}

.cap-card{
  min-height:44vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  opacity:.28;
  transform:translateY(16px);
  transition:opacity 400ms var(--ease), transform 500ms var(--ease);
}

.cap-card.is-active{
  opacity:1;
  transform:translateY(0);
}

.cap-card h3{
  margin:0 0 1rem;
  font-family:var(--serif);
  font-size:clamp(1.5rem, 2.2vw, 2rem);
  text-align:left;
}

.cap-card ul{
  list-style:none;
  padding:1rem 0 0;
  margin:0;
  border-top:1px solid rgba(47,52,50,.14);
}

.cap-card li{
  padding:.55rem 0;
  color:var(--muted);
  font-weight:var(--weight-light);
  text-align:left;
}

.capabilities-scroll-cue{
  --cap-rot: 0deg;
  position:absolute;
  left:0;
  bottom:2.2rem;
  font-size:1.2rem;
  line-height:1;
  color:var(--ink);
  opacity:.5;
  transition:opacity 260ms ease;
  animation:capCueBounce 1.8s ease-in-out infinite;
}

.capabilities-scroll-cue.is-up{
  --cap-rot: 180deg;
}

.capabilities-scroll-cue.is-hidden{
  opacity:0;
  pointer-events:none;
}

@keyframes capCueBounce{
  0%,100%{
    transform:rotate(var(--cap-rot)) translateY(0);
  }
  50%{
    transform:rotate(var(--cap-rot)) translateY(6px);
  }
}

@media (max-width: 900px){
  .capabilities-split{
    height:100vh;
    min-height:100vh;
  }

  .capabilities-inner{
    grid-template-columns:1fr;
    height:100vh;
    min-height:100vh;
  }

  .capabilities-media{
    min-height:42vh;
    height:42vh;
    border-right:none;
    border-bottom:var(--line);
  }

  .capabilities-copy{
    height:58vh;
    padding:1.5rem var(--pad) 2.2rem;
  }

  .capabilities-copy-inner{
    max-width:none;
    margin:0;
  }

  .capabilities-kicker{
    top:0;
  }

  .capabilities-stack{
    left:0;
    right:0;
    top:3.2rem;
    bottom:0;
    padding-top:3vh;
    padding-bottom:3vh;
  }

  .cap-card{
    min-height:38vh;
  }

  .capabilities-scroll-cue{
    bottom:.4rem;
  }
}

/* =====================================================
   PAGE TRANSITIONS
   ===================================================== */

body{
  opacity: 1;
  transition: opacity 520ms ease;
}

body.is-leaving{
  opacity: 0;
}

body.is-entering{
  opacity: 0;
}