:root   {
    
    --cheekyBlack: #1D1816;
    --cheekyWhite: #F8F7F4;
    --cheekyRed: #E6194D;
    
    --sansSerif: "tt-commons-pro", sans-serif;
    --serif: "marlide-display-variable", sans-serif;
    
    --smooth: 0.75s cubic-bezier(0.75, 0, 0, 1);
	
	--Maxwidth: 1486px; 
    
}

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

/* GLOBAL */

html 	{}
body 	{line-height:1; font-family: var(--sansSerif); background-color: var(--cheekyWhite); color: ; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}

h1		{font-family: var(--serif); font-weight: 300;}
h2		{font-size: 80px; font-family: var(--serif); font-weight: 400;}
h3		{font-family: var(--serif); font-weight: 300;}
h4		{font-family: var(--serif); font-weight: 300;}
h5		{font-family: var(--serif); font-weight: 300;}
h6		{font-family: var(--serif); font-weight: 300;}

p		{font-size: 20px; line-height: 150%; font-weight: 300; margin-bottom: .5em;}

sup		{top:-0.325em}

ul,
ol		{}

img     {max-width:100%; height:auto;}
a       {color:inherit;}
a.cover {position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0); display:block;}

.inner  	{width: 100%; max-width: var(--Maxwidth); margin:0 auto; padding: 0 20px}
.sub-inner 	{width: 100%; padding: 0 64px; }


.g-recaptcha div:first-of-type			{margin:auto;}

.to-top         {position: fixed;right: 0;bottom: 0;opacity:0;visibility:hidden;width: 55px;height: 55px;margin: 2.5em;padding:10px;z-index: 99;border-radius:50%;border:1px solid #838383;transition: all ease-in-out .5s;}
.to-top.active  {opacity:1;visibility:visible;}
.to-top img     {transform:rotate(-90deg);}

.cols   {display: flex; width: 100%;}

.black-page {background-color: var(--cheekyBlack);}

.black-page .hamburger span {background-color: #ffffff}

/**************/
/*** HEADER ***/
/**************/

header 						{display: flex; justify-content: center; padding: 0px 30px; width: 100%; max-width: 100%; margin: 70px auto 0px auto; z-index: 99; position: fixed; left: 0; top: 0; transition:0.75s cubic-bezier(0.75, 0, 0, 1);}
header.hide-header			{transform: translateY(-100%); visibility: hidden; opacity: 0}

.logo						{position: relative; z-index: 2}

.hamburger					{position: absolute; right: 100px; display: flex; flex-direction: column; width: 91px; height: 90%; justify-content: center; cursor: pointer; z-index: 2; transition: 0.2s ease-in-out;}
.hamburger span				{width: 100%; height: 3px; margin: 3.5px 0; background-color: #000000;filter: contrast(0.5); display: block; transition: 0.75s cubic-bezier(0.75, 0, 0, 1);}
.hamburger span:last-child	{}
.hamburger.open span			{transform: rotate(45deg); background-color: var(--cheekyWhite)}
.hamburger.open span:last-child	{transform: rotate(-45deg); margin-top: -7.5px; background-color: var(--cheekyWhite)}

.faux-header	{height: 200px; width: 100%;}

body.home .logo path    {transition:0.3s ease-in-out}

body.home .logo path#logoCheeky         {fill: #ffffff;}
body.home .logo path#logoCheekyStrap    {fill: rgba(255,255,255,0.6);}

body.home.video-passed .logo path#logoCheeky         {fill: var(--cheekyRed);}
body.home.video-passed .logo path#logoCheekyStrap    {fill: #626261;}

body.home .hamburger span               {background-color: #ffffff;}
body.home.video-passed .hamburger span  {background-color: var(--cheekyBlack);}




/************/
/*** NAV ****/
/************/

nav							{position: fixed; width: 100vw; height: 100dvh; top: -100vh; left: 0; justify-content: center; align-items: center; display: flex; flex-direction: column; z-index: 0; gap: 7vh;}
nav ul						{height: calc(100% - 200px);display: flex; align-items: center; flex-direction: column; justify-content: center; font-size: 100px; font-family: var(--serif); font-weight: 300; line-height: normal; visibility: hidden; opacity: 0; transition: 0.2s ease-out; }
nav ul li					{width: 100%; display: flex; justify-content: center; align-items: center;}
nav ul li a					{display: flex; align-items: center; justify-content: center; width: fit-content; height: 160px; white-space: nowrap; clip-path: inset(0px -50vw); perspective: 180px; color: #EAE3D4; text-transform: uppercase; font-weight: 300}
.nav-item-box 				{display: flex; justify-content: center; align-items: center; transition-property: transform; transition:0.75s cubic-bezier(0.75, 0, 0, 1); transform-style: preserve-3d; transform: rotateX(-360deg);}
.nav-text-up 				{position: absolute; transform: translateZ(-45px) rotateX(180deg); backface-visibility: hidden;}
.nav-text-up .nav-text 		{margin-bottom: 0; margin-top: 0;}
.nav-hover-top 				{position: absolute; letter-spacing: 0em; backface-visibility: hidden; transform: translateY(30%) rotateX(-90deg) scale(1);}
.nav-hover-top .nav-text 	{margin-bottom: 0; margin-top: 0; color: #FFFFFF; text-transform: uppercase;}

nav:before	{background-color: var(--cheekyBlack); width: 100%; position: absolute; left: 0; content: ''; z-index: 0; top: 0; height: 0; transition: 0.75s cubic-bezier(0.75, 0, 0, 1);}


nav ul li:hover .nav-item-box	{transform: rotateX(90deg) !important;}
nav.open			{top: 0;}
nav.open:before		{height: 100%;}
.nav-inner			{width: 100%; height: 100%; overflow-y: auto}

nav .btn.btn-light         {padding: 14px 37px 20px; border-radius: 20px; border-color: var(--cheekyWhite); transform: translateY(100%); opacity: 0; margin-bottom: 7vh; }
nav .btn.btn-light p       {font-size: 27px; color: var(--cheekyWhite)}
nav .btn.btn-light p span  {font-size: 28px;}

nav.open ul	{opacity:1 ; visibility: visible;}
nav.open li	{overflow: hidden;}

nav.open li a				{animation:nav-item-in 0.5s ease-in-out forwards; animation-delay: 0.1s; transform: translateY(100%); opacity: 0}
nav.open li:nth-child(2) a	{animation-delay: 0.15s}	
nav.open li:nth-child(3) a	{animation-delay: 0.2s}	
nav.open li:nth-child(4) a	{animation-delay: 0.25s}	
nav.open li:nth-child(5) a	{animation-delay: 0.3s}	
nav.open li:nth-child(6) a	{animation-delay: 0.35s}
nav.open .btn.btn-light     {animation:nav-item-in 0.5s ease-in-out 0.4s forwards}

nav .nav-text-up .nav-text		{font-variation-settings: "wght" 300;}
nav .nav-hover-top .nav-text	{font-variation-settings: "wght" 400;}

nav.closed			{top: 0; height: 0; transition: .5s ease-in-out; visibility: hidden}
nav.closed:before	{height: 0%;}


@keyframes nav-item-in {
	0%		{transform: translateY(100%); opacity: 0}
	100%	{transform: translateY(0px); opacity: 1}
}

/******************/
/*** HOME HERO ***/
/****************/

.home-hero                  {height: unset; display: flex; flex-direction: column;}
.home-hero-video            {font-size: 0; flex: 1; position: relative;}
.home-hero-text             {flex: 0 1 auto; padding:80px 0 90px 0}
.home-hero-video video      {position: absolute; object-fit: cover; object-position: center; width: 100%; height: 100%;}
.video-dk 					{display: block;}
.video-mb					{display: none;}

.box.box-video              {overflow: hidden; /*max-height: 75vh;*/}

.home-hero-video .box.box-video {max-height: 75vh;}
.home-hero-video .box.box-video .vimeo-container    {aspect-ratio: unset; padding-top: 56.25%}

@media (max-width: 640px) 
{
	.home-hero {min-height: 100dvh; }
	.video-dk {display: none;}
	.video-mb {display: block;}
}



/************************/
/*** HOME INTRO TEXT ***/
/**********************/

.home-intro-text			{padding: 150px 0 100px 0; position: relative}
.home-intro-text .inner		{width: 1240px; padding: 0 30px;}
.hit-text					{display: flex; justify-content: space-between; gap:100px;}
.hit-text h2				{font-size: 80px;}
.hit-left					{width: 560px; flex-shrink: 0}
.hit-right                  {padding-top: 15px; width: 556px;}

/********************/
/*** HOME LISTING ***/
/********************/

.home-listing   {padding-bottom: 80px;}

.listing-card									{display: flex; flex-direction: column; justify-content: flex-start; height: 100%; text-decoration: none; position: relative;}
.listing-card .listing-card-text				{position: relative;}
.listing-card .listing-card-text:after			{position: absolute; left: 0; bottom: 0; border-top:1px solid #EAE3D4; content: ''; width: 0%; transition:0.75s cubic-bezier(0.75, 0, 0, 1); width: 100%;}
.listing-card .listing-card-text p				{color: var(--cheekyBlack); font-weight: 500; font-size: 30px; line-height: 1.3em; transition:0.75s cubic-bezier(0.75, 0, 0, 1);}
.listing-card .listing-card-text p span			{color: var(--cheekyBlack); font-family: var(--serif); transition:0.75s cubic-bezier(0.75, 0, 0, 1); font-weight: 400}
.listing-card-image-container					{padding-top: 62%; overflow: hidden; position: relative; margin-bottom: 10px;}
.listing-card-image								{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: center; transition:0.75s cubic-bezier(0.75, 0, 0, 1);}

.listing-card:hover p,
.listing-card:hover p span						{color: var(--cheekyBlack)}
.listing-card:hover .listing-card-image			{transform: scale(1.1)}
.listing-card:hover .listing-card-text:after	{}

.home-listing .cols	{gap: 64px; flex-wrap: wrap}
.home-listing .col	{flex: 0 0 calc((100% - (2 * 32px)) / 2)}

.home-listing .button {margin-top: 80px; }

/*********************/
/*** MEDIA EXPERTS ***/
/*********************/

.media-experts  {padding-top: 80px; padding-bottom: 0px;}

.media-experts-tiles path {fill: #ffffff;}

/*****************/
/*** ACCORDION ***/
/*****************/

.accordion-set                  {margin-bottom: 80px;}
.accordion-set .inner           {width: 100%;}

.accordion						{margin-top: 60px; border-bottom: 0.2px solid var(--cheekyBlack);}
.accordion-item					{border-top: 0.2px solid var(--cheekyBlack);}
.accordion-item h3				{font-size: 60px; font-weight: 400; color: var(--cheekyBlack); font-family: var(--serif); padding: 45px 160px 54px 64px; position: relative; cursor: pointer; transition: 0.75s cubic-bezier(0.19, 1, 0.22, 1);}
.accordion-item h3 svg          {margin-left: 10px;}


.accordion-item h3 .arrow svg {width: 30px; transition: 0.75s cubic-bezier(0.19, 1, 0.22, 1);}
.accordion-item h3 .arrow svg .cls-1 {fill: var(--cheekyBlack);transition: 0.75s cubic-bezier(0.19, 1, 0.22, 1);}

.accordion-item h3 .arrow,
.accordion-item h3 img          {position: absolute; right: 64px; top: 20%; margin-top: 0px; transition: 0.75s cubic-bezier(0.19, 1, 0.22, 1); width: 30px; height: 30px; transition: 0.75s cubic-bezier(0.19, 1, 0.22, 1);}




.accordion-item.active h3 .arrow svg .cls-1,
.accordion-item h3:hover .arrow svg .cls-1 {fill: var(--cheekyRed);}

.accordion-item h3:hover .arrow svg,
.accordion-item h3:hover img    {transform: rotate(30deg);}

.accordion-item h3:hover		{}
.accordion-expanded				{padding-bottom: 40px; display: none; padding-left: 64px;}
.accordion-expanded .inner		{padding-right: 180px;}
.accordion-expanded p			{width: 100%; max-width: 870px}

.accordion-item.active h3:hover	    {}
.accordion-item.active h3 img       {transform: rotate(-90deg) !important}
.accordion-item.active svg path     {fill:var(--cheekyRed); }


/************/
/*** FAQs ***/
/************/

.faqs-section .accordion-set .inner             {width: 100%;}
.faqs-section .accordion-set .inner.inner-full  {width: 100%; padding: 0}

.faqs-section .accordion-item h3    {padding-left: 0; font-family: var(--sansSerif); font-size: 40px; font-weight: 500}
.faqs-section .accordion-expanded   {padding-left: 0;}
.faqs-section .accordion-expanded .btn  {display: inline-block; margin-top: 40px;}

/*******************/
/*** OUR BRANDS ***/
/*****************/

.our-brands			{padding: 140px 0; background-color: #000}
.our-brands h2		{color: #ffffff}
.accordion .inner,
.our-brands .inner	{}
.brands-intro		{width: 620px; max-width: 100%; margin-bottom: 100px;}

.our-brands .brands-listing						{display:flex; flex-wrap:wrap; row-gap:2em; column-gap:5px; justify-content:flex-start; align-items:center;}
.our-brands .brands-listing .brand-item			{flex: 0 0 calc((100% - (5 * 5px)) / 6); height: 110px;overflow: hidden;display: flex;justify-content: center;align-items: center;padding:20px;}
.our-brands .brands-listing .brand-item img		{height:100%; max-width: unset}

.our-brands .button {margin-top:  80px;}

/********************/
/*** OUR PROCESS ***/
/******************/

.our-process            {padding: 124px 0}
.our-process h3         {color: var(--cheekyRed); font-weight: 300; font-family: var(--sansSerif); font-size: 30px; padding-left: 64px; margin-bottom: 70px;}
.our-process .inner     {}
.process-item           {display: flex; justify-content: space-between; padding:  0 64px; align-items: center; border-top: 0.2px solid var(--cheekyBlack); padding-bottom: 20px; gap: 40px;}
.process-left h2        {font-weight: 300; font-size: 200px;}
.process-left h2 sup    {font-size: 42%; transform: translateY(-50px); display: inline-block; margin-left: 15px; font-weight: 400}
.process-right          {width: 100%; max-width: 556px;}
.process-right p        {margin-bottom: 0}

.button-with-line           {position: relative; display: flex; justify-content: flex-end;}
.button-with-line:before    {width: calc(100% - 330px); content: ''; position: absolute; border-top: 0.2px solid var(--cheekyBlack); left: 0;top: 50%;}


/*********************/
/*** OUR PARTNERS ***/
/*******************/

.partners-section   {padding: 200px 0}
.partner-marquee    {width: 100%; overflow: hidden; position: relative; margin-top: 55px;}
.partner-track      {display: flex; align-items: center; gap: 21px;}
.partner-logos      {display: flex; align-items: center; gap: 21px; margin: 0; padding: 0; box-sizing: border-box;}
.partner-logo       {width: 277px; height: 160px; display: flex; justify-content: center; align-items: center; border: 0.2px solid var(--cheekyBlack); border-radius: 30px; flex-shrink: 0;}
.partner-logo img   {max-width: 138px; max-height: 50px;}

.partner-track.is-animated {animation: marquee linear infinite;  animation-duration: var(--marquee-duration, 20s); /* fallback if JS doesn't set it */ animation-timing-function: linear;}

.partners-section h3    {text-align: center; display: block; font-size: 40px; font-weight: 500; font-family: var(--sansSerif);}

.partner-no-scroll                  {overflow: visible; margin-top: 55px}
.partner-no-scroll .partner-logo    {width: auto; flex: 1;}

.partners-section-2     {padding: 200px 0}

.partners-section .button {margin-top:  80px;}

/* Keyframes use the CSS variable set by JS for exact pixel translation */
@keyframes marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(calc(-1 * var(--scroll-distance))); }
}

.partner-marquee:hover .partner-track.is-animated {
  animation-play-state: paused;
}


/*********************/
/*** NEWS & VIEWS ***/
/*******************/

.news-views-section 		{background-color: var(--cheekyBlack); padding: 150px 0;}
.news-views-section	h2		{font-size: 200px; color: #FFFFFF; text-transform: uppercase; display: block; text-align: center; font-weight: 300}
.news-views-section .inner	{width: 100%; padding: 0 64px;}

.news-views-section .cols	{display: flex; flex-wrap: wrap; gap: 64px; justify-content:space-between; margin: 90px auto; max-width: 2000px;}
.news-views-section .col	{width: 30%;}

.listing-card									{display: flex; flex-direction: column; justify-content: flex-start; height: 100%; text-decoration: none; position: relative;}
.listing-card .listing-card-text				{position: relative;}
.listing-card .listing-card-text:after			{position: absolute; left: 0; bottom: 0; border-top:1px solid #EAE3D4; content: ''; width: 100%; transition:0.75s cubic-bezier(0.75, 0, 0, 1);}
.news-views-section .listing-card .listing-card-text p				{color: #ffffff; font-weight: 400; font-size: 26px; text-transform: uppercase; line-height: 1.3em; transition:0.75s cubic-bezier(0.75, 0, 0, 1);}
.news-views-section .listing-card .listing-card-text p span			{color: #ffffff; font-family: var(--serif); transition:0.75s cubic-bezier(0.75, 0, 0, 1);}
.listing-card-image-container					{padding-top: 55%; overflow: hidden; position: relative; margin-bottom: 10px;}
.listing-card-image								{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: center; transition:0.75s cubic-bezier(0.75, 0, 0, 1);}

.news-views-section .listing-card:hover p,
.news-views-section .listing-card:hover p span   {color: #EAE3D4}
.listing-card:hover .listing-card-image			{transform: scale(1.1)}
.listing-card:hover .listing-card-text:after	{}


/****************************/
/*** TESTIMONIAL SECTION ***/
/**************************/

.testimonial-section                {/*height: 100dvh; min-height: 768px;*/ padding: 100px 0 40px}
.testimonial-section .inner         {display: flex; align-items: center; justify-content: center; text-align: center; height: 100%; flex-wrap: wrap; gap: 40px; padding-bottom: 40px;   }
.testimonial-section .testimonial   {width: 100%; max-width: 1176px; padding: 140px 40px; border: 1px solid #1D1816; border-radius: 30px;}
.testimonial-section p              {font-size: 34px; line-height: 1.2em; max-width: 860px; margin: auto;}
.testimonial-section p span 		{color: #969696; font-size: 39spx;}
.testimonial-section cite           {font-size: 34px; font-style: normal; margin-top: 50px; display: block; color: #1D1816;line-height: 1.2em;}
.testimonial-section cite span      {display: block; font-size: 34px; color: #969696;}      

.testimonial-section-2 p            {font-family: var(--serif); font-size: 70px; font-weight: 400; line-height: 1em}
.testimonial-section-2 cite         {font-size: 45px;}
.testimonial-section-2 .testimonial {width: 100%; max-width: 865px;}
.testimonial-section-2 p strong       {color: var(--cheekyRed); font-weight: normal;}

/********************/
/*** PAGE HEADING ***/
/********************/

.page-heading							{padding:300px 0 100px 0; text-align: center;}
.page-heading .page-heading-text		{animation: heading-in 2s cubic-bezier(0.19, 1, 0.22, 1) 0.25s forwards; opacity: 0; transform: translateY(100px)}
.page-heading .page-heading-text h1		{font-size: 200px; line-height: 0.8em; text-transform: uppercase; }

.page-heading.full	{height: 100vh; width: 100%; display: flex; justify-content: center; align-items: center; padding: 0}

.page-heading.full.case-study-page-heading.inline {height: auto; padding: 100px 0px; }


.page-heading.page-heading-sticky		{position: fixed;top: 200px;left: 50%;transform: translate(-50%, 0);z-index: 2;padding:0;width:100%;}

@keyframes heading-in {
	0% 	{opacity: 0; transform: translateY(100px)}
	100% {opacity: 1; transform: translateY(0px)}	
}

/**************************/
/*** PAGE HEADING IMAGE ***/
/**************************/

.banner-header-section											{position: relative; z-index: 3;}
.banner-header-section.banner-header-section-sticky				{padding-top:700px;}
.banner-header-section.banner-header-section-sticky-extra       {padding-top: 850px; font-size: 0}
.banner-header-section .banner-image img.banner-mb				{display:none;}
.banner-image			{margin-top: -90px;/*transform: scale(0);*/}
.banner-image img		{width:100%;}


/********************/
/*** TWO COL TEXT ***/
/********************/

.two-col-text           {padding: 100px 0}
.two-col-text.black     {background-color: var(--cheekyBlack);}
.two-col-text.black h2  {color: #ffffff;}
.two-col-text.black p   {color: #ffffff;}

/**********************/
/*** MEDIA SERVICES ***/
/**********************/

.media-services             {padding-bottom: 150px;}
.media-services-container   {border: 0.2px solid var(--cheekyBlack);}
.media-service              {display: flex;}
.ms-text                    {width: 50%; padding: 94px; position: relative; display: flex; align-items: center;}
.ms-text .btn               {display: inline-block; margin-top: 30px;}
.ms-text h3                 {font-size: 60px; font-weight: 400; margin-bottom: 40px;}
.ms-image                   {width: 50%; position: relative; min-height: 600px; overflow: hidden}
.ms-image-inner             {position: absolute; inset:0; background-size: cover; background-position: center;}

.icon,
.ms-icon                    {position: absolute; background-color: #F4F1EC; right: 0; top: 0; width: 90px; height: 90px; display: flex; justify-content: center; align-items: center; border: 0.2px solid #C9C9C9;}

.media-service:nth-child(even)   {flex-direction: row-reverse}


/***************************/
/*** MEDIA EXPERTS TILES ***/
/***************************/

.media-experts-tiles    {background-color: var(--cheekyBlack); padding: 125px 0}
.media-experts-tiles h2 {color: #ffffff; margin-bottom: 0.5em}
.media-experts-tiles p  {color: #ffffff;}

.met-card               {}
.met-card .icon         {background: rgba(255, 255, 255, 10.02); background: linear-gradient(45deg,rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0) 100%); border-color: #818181; top: 0; right: 0}

.met-listing            {margin: 100px 0 78px;}
.met-listing .cols      {flex-wrap: wrap}
.met-listing .cols .col {flex: 33.333%; border:0.2px solid rgba(255,255,255,0.5); padding: 85px 50px 78px 70px; position: relative; border-collapse: collapse}


/**************************/
/*** CASE STUDY LISTING ***/
/**************************/

.case-study-listing .cols   {flex-wrap: wrap; gap: 64px; margin-bottom: 140px;}
.case-study-listing .col    {width:calc(50% - 32px);}
.case-study-card            {text-decoration: none; display: block}
.listing-image-container    {overflow: hidden; position: relative; padding-top: 77%;}
.listing-image              {position: absolute; inset:0; background-size: cover; background-position: center; transition: var(--smooth);}
.csc-text                   {padding: 14px 50px 14px 20px; position: relative;}
.csc-text p                 {font-weight: 500; font-size: 30px; line-height: 1.2em; width: 100%; max-width: 520px; margin-bottom: 0; position: relative; }
.csc-text:before            {width: 23px; height: 21px; background-image: url(/_uploads/_assets/arrow-black.svg); background-size: cover; position: absolute; right: 20px; top: 22px; content: '';transition: var(--smooth);}
.csc-text:after             {border-top: 0.2px solid #000000; width: 100%; position: absolute; bottom: 0; left: 0; content: ''; display: block;}

.case-study-card:hover .listing-image   {transform: scale(1.1)}
.case-study-card:hover .csc-text:before {right: 0}

.case-study-hidden          {display: none !important;}


/******************/
/*** CASE STUDY ***/
/******************/

.case-study-section             {padding: 0 0 50px 0;}

.case-study-subtitle			{border: 0.5px solid #9E9B98; padding: 8px 25px 16px 25px; border-radius: 25px; width: fit-content; margin: 2.5em auto 3em;}
.case-study-subtitle h2			{font-size: 40px; margin: 0px;}




.case-study-video-section,
.case-study-image-section		{width: 100%; margin-top: 0px;}
.case-study-video-section video,
.case-study-image-section img	{width: 100%; height: 100%}
.case-study-video-section .box,
.case-study-image-section .box	{transform-origin: top; opacity: 1; transform: scale(0.85); background-color: transparent}

.vimeo-container				{/* padding:56.25% 0 0 0;*/ aspect-ratio:16 / 9; position:relative;}

.case-study-intro-text			{padding: 100px 0; position: relative}
.case-study-intro-text .inner	{}
.csit-text						{display: flex;gap:1em;}
.csit-text h2					{font-size: 70px; line-height: 0.9em}
.csit-left						{width: 50%; flex-shrink: 0}

.three-text-section         {padding: 100px 0 140px; text-align: center;}
.three-text-section .cols   {gap: 140px;}
.three-text-section .col    {flex: 0 0 calc((100% - (2 * 140px)) / 3)}
.three-text-section h2      {font-size: 150px; font-weight: 300; margin-bottom: 30px; }
.three-text-section p      	{font-size: 34px; font-weight: 400; line-height: 1.3em;}

/*ss
.case-study-carousel .slick-track   {display: flex; gap: 64px;}
.case-study-carousel .slick-slide       {}
.case-study-carousel .slick-slide img   {width: 100%;}
*/

.case-study-carousel .slick-slide       {display: flex !important; justify-content: center; align-items: center; overflow: hidden; padding: 0 30px;}
.case-study-carousel .slick-slide img   {max-height: 752px; width: auto; height: auto; max-width: 100%; object-fit: contain;}

/**************************/
/*** CASE STUDY Section ***/
/**************************/
 
.case-study-section-item         							{padding: 60px 0;}
.case-study-section-item .cols   							{gap: 140px;}
.case-study-section-item .col    							{flex: 0 0 calc((100% - (2 * 140px)) / 3)}
.case-study-section-item h2      							{font-size: 80px; margin-bottom: 30px; font-weight: 300;}

.case-study-section-item .cs-si-container 					{display: flex; justify-content: space-between; gap: 64px; }
.case-study-section-item .cs-si-container .cs_col_left 		{width: 50%; /*max-width: 556px;*/ }
.case-study-section-item .cs-si-container .cs_col_right 	{width: 50%; /*max-width: 556px;*/ }

.case-study-section-item .cs_text_intro p 					{font-size: 34px; line-height: 120%; margin-bottom: 34px; }
.case-study-section-item .cs_text_intro ul 					{font-size: 34px; line-height: 100%; margin-left: 34px; font-family: var(--sansSerif); font-weight: 300;}
.case-study-section-item .cs_text_intro ul li 				{margin-bottom: 16px; }

.case-study-section-item .cs_text_intro ul li::marker 		{font-size: 0.7em; }




.case-study-section-item .cs_text_pre p,
.case-study-section-item .cs_text_expanded p 				{font-size: 20px; line-height: 150%; margin-bottom: 34px; }
    
.case-study-section-item .cs_images 						{margin-top: 90px; display: flex; flex-wrap: nowrap; gap: 64px; }
.case-study-section-item .cs_images img.half 				{width: calc(50% - 64px); flex: auto;}

.case-study-section-item .cs-read-more 						{color: var(--cheekyRed); text-decoration: underline; cursor: pointer; margin: 32px 0 16px 0; display: block; transition: 0.3s ease-in-out; }
.case-study-section-item .cs-read-more:hover				{opacity: 0.5;}
.case-study-section-item .cs_text_expanded 					{margin-top: 0px; overflow: hidden; max-height: 0; opacity: 0; transition: 0.5s ease-in-out; }
.case-study-section-item .cs_text_expanded.is-open 			{max-height: 2000px; opacity: 1; }





.case-study-section-item sub, 
.case-study-section-item sup 								{font-size: 30%; top: -34px; font-family: var(--sansSerif);}

.three-text-section p,
.three-text-section h2 										{text-align: center;}


@media (max-width: 720px) 
{
	
	.case-study-section-item h2 								{font-size: 50px; display: flex; justify-content: space-around; width: 100%; display: block; }
	.case-study-section-item .cs_text_intro ul,
	.case-study-section-item .cs_text_intro p 					{font-size: 24px; }
	.case-study-section-item .cs_text_pre p,
	.case-study-section-item .cs_text_expanded p				{font-size: 18px; }
	
	.case-study-section-item sub, 
	.case-study-section-item sup 								{font-size: 30%; top: 20px; float: right; font-weight: 400;}
	
	.case-study-section-item .cs-si-container,	
	.case-study-section-item .cs_images							{flex-direction: column; gap: 20px; }					
	
	.case-study-section-item .cs-si-container .cs_col_left,
	.case-study-section-item .cs-si-container .cs_col_right,
	.case-study-section-item .cs_images img.half				{width: 100%;}
	
	.three-text-section h2      								{font-size: 120px; }
	.three-text-section p      									{font-size: 24px; }
}



/********************/
/*** NEXT PROJECT ***/
/********************/

.next-project-section							{position: relative; padding: 160px 0; margin: 100px 0 30px; overflow: hidden;}
.next-project-section:after						{position: absolute; left: 0; top: 0;  inset: 0; content: ''; background-color: rgba(0,0,0,0.5);}
.next-project-section.hovered .next-project-bg 	{transform: scale(1.1);}
.next-project-section .buttons					{margin: 40px 0;}
.next-project-section .btn						{position: relative; z-index: 2; width: 450px; justify-content: center;}
.next-project-bg								{position: absolute; left: 0; top: 0;  inset: 0; background-size: cover; background-position: center; transition: ease-in-out .35s;}


/********************/
/*** NEWS LISTING ***/
/********************/

.black-page h1  {color: #ffffff;}

ul.tags				{display: flex; list-style: none; justify-content: center; margin-top: 100px; font-size: 14px;}
ul.tags.animate		{animation: 1s heading-in cubic-bezier(0.19, 1, 0.22, 1) 0.75s forwards; opacity: 0;transform: translateY(100px); }
ul.tags li			{margin: 0 7.5px; color: #ffffff; border: 0.2px solid #5d5d5d; padding: 13px 19px; border-radius: 15px;}

ul.tags.blk li      {color: #000;}

.news-listing					{padding: 80px 0}
.news-listing-item				{width: fit-content; max-width: 100%; margin:0 auto 125px auto; text-align: center; display: flex;flex-direction: column; justify-content: center; align-items: center; text-decoration: none;}
.news-listing-item:last-child	{margin-bottom: 0}
.news-listing-item h2			{font-size: 70px; margin-bottom: 0; display: flex;justify-content: center; padding: 0 1em; color: #ffffff; width: 100%; max-width: 870px;}
.news-listing-item h2 a			{text-decoration: none; transition: 0.75s cubic-bezier(0.19, 1, 0.22, 1); display: block}
.news-listing-item h2 a:hover	{transform: scale(1.05)}
.news-listing-item ul.tags		{margin-top:50px;margin-bottom:20px;z-index:6;position:relative;}
.news-listing-item ul.tags li,

.news-listing .news-listing-item                    {position:relative;}
.news-listing .news-listing-item a span.white       {color: #fff;opacity: 0;transition: opacity .3s;position: absolute;top: 0;left: 0;}
.news-listing .news-listing-item img                {width:100%; max-width:1000px; max-height:600px; opacity:1; object-fit: cover; pointer-events: none; transition: ease-in-out .3s; position: relative; top: unset; right: unset; margin-bottom: 30px;}
.news-listing .news-listing-item img.image-mb		{display:none;}

.news-listing-item	{transform: translateY(150px); opacity: 0}

.news-article .btn p	{text-align: center}

.news-listing-item:hover img    {transform: scale(1.04)}


/********************/
/*** NEWS ARTICLE ***/
/********************/

.news-header    {margin-bottom: 80px; }
.news-inner     {width: 556px; max-width: 100%; margin: auto;}
.news-inner h2  {font-size: 70px; color: #013D3E; margin-bottom: 0.5em; font-weight: 300; }





/**********************/
/*** PEOPLE LISTING ***/
/**********************/

.black,
.people-listing.black       {background-color: var(--cheekyBlack);}
.black,
.people-listing.black h2    {color: #ffffff}
.black,
.people-listing.black h3    {color: #ffffff}
.black,
.people-listing.black p     {color: #ffffff;}

.people-listing         {padding-bottom: 120px;}

.people-listing h2      {font-size: 60px; margin-bottom: 0.45em}
.people-listing h3      {font-size: 24px; font-weight: 500; font-family: var(--sansSerif); margin-bottom: 0.65em}
.people-listing p       {font-size: 16px;}

.people-listing img     {margin-bottom: 20px;}

.people-listing .cols	{gap: 140px; flex-wrap: wrap;}
.people-listing .col	{flex: 0 0 calc((100% - (2 * 140px)) / 3)}

.people-listing .button {margin-top: 60px}


/****************************/
/*** TEXT SECTION CENTRED ***/
/****************************/

.text-section-centred           {text-align: center; padding:100px 0 150px;}
.text-section-centred.black h2  {font-size: 200px; font-weight: 300; line-height: 0.8em; margin-bottom: 0.45em; color: var(--cheekyWhite);}
.text-section-centred p         {margin-bottom: 1em}
.text-section-centred .inner    {width: 100%; max-width: 875px;}
.text-section-centred .button   {margin-top: 70px;}


/********************/
/*** CONTACT PAGE ***/
/********************/

.contact-page .form-container       {width: 100%; max-width: 684px; margin: auto}
.contact-page .form-container label {font-size: 30px; font-weight: 500}
.contact-page .form-row             {margin-bottom: 30px;}
.contact-page .form-cell            {display: flex; flex-direction: column; gap: 10px;}
.contact-page input[type="text"],
.contact-page textarea              {border: 0.25px solid var(--cheekyBlack); background-color: transparent; border-radius: 30px; padding: 35px; font-size: 20px; transition: var(--smooth);}

.contact-page input[type="text"]:focus,
.contact-page textarea:focus        {box-shadow: inset 0 0 0 0.75px var(--cheekyBlack);}

.contact-page textarea              {height: 220px;}

.form-row.form-row-submit           {display: flex; justify-content: center; margin-top: 40px;}
.form-row.form-row-submit button    {width: 100%; max-width: 274px; text-align: center; justify-content: center;}

button  {background-color: transparent}

/**************/
/*** FOOTER ***/
/**************/

footer			{background-color: var(--cheekyWhite); position: relative; z-index: 2}
footer .inner	{width: 100%; max-width: 1540px; padding: 0 30px;}

.footer-top							{padding: 100px 0; background-color: var(--cheekyWhite)}
.footer-top:not(:has(.inner))		{padding: 50px 0;}
.footer-top p			{font-size: 26px; color: #707070; font-weight: 300; line-height: 1.3em; margin-bottom: 0}
.footer-top p a			{color: #020202; text-decoration: none; transition: 0.2s ease-out}
.footer-top p a:hover	{color: #707070;}
.footer-top h3			{font-size: 180px; color: #020202; text-transform: uppercase; line-height: 0.8em; margin: 0 0 0.25em;}

.footer-top .cols		{display: flex; justify-content: space-between; gap: 80px;}

.footer-bottom			{background-color: #ffffff; padding: 80px 0 60px}
.footer-bottom .cols	{display: flex; justify-content: space-between}
.footer-bottom .col		{flex: 1;}
.footer-bottom .col:last-child		{display: flex; justify-content: flex-end}
.footer-bottom .col:last-child ul	{column-count: 1;}
.footer-bottom .col:nth-child(2)	{text-align: center;}

.footer-bottom ul		{list-style: none; font-size: 18px; column-count: 2}
.footer-bottom ul li	{margin-bottom: 15px; font-weight: 300}
.footer-bottom ul li a	{text-decoration: none; color: var(--cheekyBlack); transition: 0.2s ease-out}

.footer-bottom ul.social	{margin-left: 50px;}
.footer-bottom ul.social li	{margin-bottom: 10px;}

.footer-bottom ul li a:hover	{color: #707070; fill:#707070}

.footer-sign-off	{text-align: center; background-color: var(--cheekyBlack); padding: 10px 0}
.footer-sign-off p	{font-size: 14px; color: #ffffff; margin: 0}

.footer-right-col	{width: 680px; max-width: 100%; display: none;}

.footer-right-col .form-text-box label					{color: #020202}
.footer-right-col .form-text-box:focus-within label 	{font-weight: 600; color: #020202;}

.footer-right-col .form-text-box input	{color: #020202}
.footer-right-col .form-text-box:after	{border-color:#020202}

.footer-right-col .form-intro				{text-align: left;}
.footer-right-col .form-container			{margin-top: 40px; margin-bottom: 0; width: 100%;}
.footer-right-col .form-row					{margin-bottom: 40px;}
.footer-right-col .form-container .button	{margin-top: 40px;}

.reverse-footer .footer-top {background-color: #020202; padding: 50px 0px; }

.reverse-footer .footer-right-col	{display: block;}

.reverse-footer .footer-right-col .form-text-box label,
.reverse-footer .footer-top h2,
.reverse-footer .footer-top h3,
.reverse-footer .footer-right-col .form-text-box input,
.reverse-footer .footer-top p a,
.reverse-footer .footer-top p {color: var(--cheekyWhite); }


.reverse-footer .footer-right-col .form-text-box input {border-bottom: 2px solid #5b5b5b;}
.reverse-footer .button a {border: 1px solid var(--cheekyWhite);}


/******************/
/*** FULL IMAGE ***/
/******************/

.full-image img {width: 100%; margin-top: 150px;}

/**************/
/*** BUTTON ***/
/**************/

.buttons,
.button		{display: flex; justify-content: center;}

.buttons		{margin:80px 0 40px 0}
.buttons .btn	{margin: 0 20px}

.btn		{border:0.2px solid var(--cheekyBlack); border-radius: 30px; text-transform: uppercase; display: flex; align-items: baseline; text-decoration: none; padding: 20px 37px 22px; position: relative; overflow: hidden}
.btn span	{font-family: var(--serif); letter-spacing: 0; font-weight: 300; font-size: 47px; margin-left: 0px;}
.btn p		{margin: 0; letter-spacing: -1px; font-weight: 400; font-size: 45px; line-height: unset}

.btn,
.btn *					{transition: all 0.75s cubic-bezier(0.19, 1, 0.22, 1);}
.btn-bg					{position: absolute; background-color: #342B28; top: 50%; left: 0; width: 100%; height: 0; padding-top: 100%; padding-top: calc(100% + 2.66em); border-radius: 100px; opacity: 0; -webkit-transform: translateY(-50%) scale(0); -ms-transform: translateY(-50%) scale(0); transform: translateY(-50%) scale(0);}
.btn-bg-2				{position: absolute; background-color: #000000; top: 50%; left: 0; width: 100%; height: 0; padding-top: 100%; padding-top: calc(100% + 2.66em); border-radius: 100px; opacity: 0; -webkit-transform: translateY(-50%) scale(0); -ms-transform: translateY(-50%) scale(0); transform: translateY(-50%) scale(0);}
.btn p					{color:var(--cheekyBlack); margin: 0; padding: 0; position: relative; z-index: 10;}
.btn:hover				{}
.btn:hover p			{transform: scale(1.04); color: #EAE3D4}
.btn:hover .btn-bg		{transition: opacity 0.75s 0s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s 0.05s cubic-bezier(0.19,1,0.22,1); transform: translateY(-50%) scale(1.1); opacity: 1;}
.btn:hover .btn-bg-2	{transition: opacity 0.75s 0s cubic-bezier(0.19, 1, 0.22, 1), transform 0.8s 0.1s cubic-bezier(0.19,1,0.22,1); transform: translateY(-50%) scale(1.1); opacity: 1;}


.btn.btn-light					{border-color: #FFFFFF}
.btn.btn-light p				{color: #FFFFFF}
.btn.btn-light:hover p			{color: #000000}
.btn.btn-light.btn .btn-bg		{background-color: #EAE3D4;}
.btn.btn-light.btn .btn-bg-2	{background-color: #ffffff;}

.btn.loading                    {pointer-events:none;opacity:.6;user-drag:none;}

.btn:active,
.btn:focus                  {background-color:transparent;}

.btn.btn-small          {padding: 20px 37px 22px;}
.btn.btn-small p        {font-size: 33px}
.btn.btn-small p span   {font-size: 35px}