.elementor-231 .elementor-element.elementor-element-e4542d5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-231 .elementor-element.elementor-element-e4542d5.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-231 .elementor-element.elementor-element-4dd3617 > .elementor-widget-container{margin:0100px 0px 0px 0px;}.elementor-231 .elementor-element.elementor-element-aac7af7 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-231 .elementor-element.elementor-element-368e755 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-231 .elementor-element.elementor-element-8e89ac1 > .elementor-widget-container{margin:0px 0px 0px 0px;}.elementor-231 .elementor-element.elementor-element-90f929f > .elementor-widget-container{margin:0px 0px 0px 0px;}@media(min-width:768px){.elementor-231 .elementor-element.elementor-element-e4542d5{--width:100%;}}/* Start custom CSS for html, class: .elementor-element-4dd3617 *//* ==========================================================
   STORILINE — SERVICES HERO
========================================================== */

.storiline-services-hero {
	--purple: #704c6d;
	--grey: #4d4d4d;
	--green: #5b8482;
	--black: #252223;
	--line: #d7d4d3;

	position: relative;

	width: 100%;

	background: #ffffff;
	color: var(--grey);

	padding: 95px 0 85px;

	overflow: hidden;
}


/* ==========================================================
   INNER
========================================================== */

.storiline-services-hero__inner {
	width: min(92%, 1400px);

	margin: 0 auto;
}


/* ==========================================================
   EYEBROW
========================================================== */

.storiline-services-hero__eyebrow {
	margin: 0 0 42px;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 36px;
	font-weight: 600;

	line-height: 1.2;

	color: var(--purple);
}


/* ==========================================================
   STATEMENT WRAP
========================================================== */

.storiline-services-hero__statement {
	max-width: 1180px;
}


/* ==========================================================
   TITLE
========================================================== */

.storiline-services-hero__title {
	max-width: 1150px;

	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: clamp(54px, 5.5vw, 82px);
	font-weight: 600;

	line-height: 1.04;

	letter-spacing: -0.05em;

	color: var(--black);
}


/* ==========================================================
   INTRO
========================================================== */

.storiline-services-hero__intro {
	max-width: 850px;

	margin: 32px 0 0;

	font-family:
		"Source Serif Pro",
		"Source Serif 4",
		Georgia,
		serif;

	font-size: 28px;
	font-weight: 400;

	line-height: 1.43;

	letter-spacing: -0.015em;

	color: var(--grey);
}


/* ==========================================================
   SERVICE AREAS
========================================================== */

.storiline-services-hero__areas {
	display: grid;

	grid-template-columns:
		repeat(4, minmax(0, 1fr));

	margin-top: 70px;

	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}


/* ==========================================================
   AREA
========================================================== */

.storiline-services-hero__area {
	display: flex;

	flex-direction: column;

	justify-content: space-between;

	min-height: 145px;

	padding: 26px;

	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}


/* ==========================================================
   NUMBER
========================================================== */

.storiline-services-hero__number {
	font-family:
		"Poppins",
		sans-serif;

	font-size: 12px;
	font-weight: 500;

	line-height: 1.2;

	letter-spacing: 0.06em;

	color: var(--green);
}


/* ==========================================================
   AREA TITLE
========================================================== */

.storiline-services-hero__area-title {
	font-family:
		"Poppins",
		sans-serif;

	font-size: 23px;
	font-weight: 600;

	line-height: 1.15;

	letter-spacing: -0.025em;

	color: var(--black);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 1024px) {

	.storiline-services-hero {
		padding: 80px 0 75px;
	}


	.storiline-services-hero__inner {
		width: 92%;
	}


	.storiline-services-hero__eyebrow {
		margin-bottom: 35px;

		font-size: 20px;
	}


	.storiline-services-hero__title {
		font-size: clamp(48px, 6.5vw, 68px);
	}


	.storiline-services-hero__intro {
		font-size: 24px;
	}


	.storiline-services-hero__areas {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));

		margin-top: 55px;
	}


	.storiline-services-hero__area {
		min-height: 125px;
	}

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767px) {

	.storiline-services-hero {
		padding: 60px 0 65px;
	}


	.storiline-services-hero__inner {
		width: 90%;
	}


	.storiline-services-hero__eyebrow {
		margin-bottom: 28px;

		font-size: 18px;
	}


	.storiline-services-hero__title {
		max-width: none;

		font-size: 44px;

		line-height: 1.05;
	}


	.storiline-services-hero__intro {
		max-width: none;

		margin-top: 25px;

		font-size: 21px;

		line-height: 1.45;
	}


	.storiline-services-hero__areas {
		grid-template-columns: 1fr;

		margin-top: 45px;
	}


	.storiline-services-hero__area {
		flex-direction: row;

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

		gap: 25px;

		min-height: 0;

		padding: 21px 22px;
	}


	.storiline-services-hero__number {
		width: 35px;
	}


	.storiline-services-hero__area-title {
		font-size: 21px;
	}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-aac7af7 *//* ==========================================================
   STORILINE — SERVICE SECTION
   STRATEGY
========================================================== */

.storiline-service-section {
	--purple: #704c6d;
	--grey: #4d4d4d;
	--green: #5b8482;
	--green-soft: #8fa6a4;
	--black: #252223;
	--white: #ffffff;
	--line: rgba(255, 255, 255, 0.25);

	position: relative;

	width: 100%;

	overflow: hidden;

	isolation: isolate;
}


/* ==========================================================
   STRATEGY VARIANT
========================================================== */

.storiline-service-section--strategy {
	position: relative;

	padding: 100px 0 105px;

	background: var(--purple);

	color: var(--white);
}


/* ==========================================================
   CONTINUING S CURVE

   Decorative layer only.
   Shifted left so it stays out of the main copy column.
========================================================== */

.storiline-service-section__line {
	position: absolute;

	z-index: 0;

	top: 115px;

	left: calc(-3% - 140px);

	width: min(53vw, 760px);

	height: calc(100% - 35px);

	pointer-events: none;
}


/* ==========================================================
   SVG
========================================================== */

.storiline-service-section__line svg {
	display: block;

	width: 100%;
	height: 100%;

	overflow: visible;
}


/* ==========================================================
   CURVE
========================================================== */

.storiline-service-section__curve {
	fill: none;

	stroke: rgba(255, 255, 255, 0.22);

	stroke-width: 9;

	stroke-linecap: round;
	stroke-linejoin: round;

	opacity: 0;

	will-change:
		stroke-dashoffset,
		opacity;
}


/* ==========================================================
   WAYPOINTS
========================================================== */

.storiline-service-section__waypoint {
	fill: var(--green-soft);

	stroke: none;

	opacity: 0;

	transform-box: fill-box;
	transform-origin: center;

	transform: scale(0.8);

	will-change:
		transform,
		opacity;
}


/* ==========================================================
   INNER
========================================================== */

.storiline-service-section__inner {
	position: relative;

	z-index: 2;

	display: grid;

	grid-template-columns:
		minmax(220px, 0.7fr)
		minmax(0, 2fr);

	gap: clamp(70px, 9vw, 150px);

	width: min(92%, 1400px);

	margin: 0 auto;
}


/* ==========================================================
   LEFT / ASIDE
========================================================== */

.storiline-service-section__aside {
	display: flex;

	flex-direction: column;

	align-items: flex-start;
}


/* ==========================================================
   SERVICE NAME
========================================================== */

.storiline-service-section__name {
	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: clamp(38px, 3.7vw, 58px);
	font-weight: 600;

	line-height: 1;

	letter-spacing: -0.045em;

	color: var(--white);
}


/* ==========================================================
   MAIN
========================================================== */

.storiline-service-section__main {
	min-width: 0;
}


/* ==========================================================
   HEADLINE
========================================================== */

.storiline-service-section__headline {
	max-width: 950px;

	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: clamp(42px, 4.4vw, 68px);
	font-weight: 600;

	line-height: 1.07;

	letter-spacing: -0.045em;

	color: var(--white);
}


/* ==========================================================
   BODY COPY
========================================================== */

.storiline-service-section__body {
	display: grid;

	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	gap: 55px;

	max-width: 980px;

	margin-top: 55px;
}


.storiline-service-section__body p {
	margin: 0;

	font-family:
		"Source Serif Pro",
		"Source Serif 4",
		Georgia,
		serif;

	font-size: 23px;
	font-weight: 400;

	line-height: 1.5;

	color: rgba(255, 255, 255, 0.88);
}


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

.storiline-service-section__capabilities {
	margin-top: 70px;

	padding-top: 25px;

	border-top: 1px solid var(--line);
}


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

.storiline-service-section__capabilities-label {
	margin: 0 0 25px;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 16px;
	font-weight: 500;

	line-height: 1.2;

	letter-spacing: 0.12em;

	text-transform: uppercase;

	color: rgba(255, 255, 255, 0.55);
}


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

.storiline-service-section__capabilities-grid {
	display: grid;

	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	column-gap: 60px;
}


.storiline-service-section__capabilities-grid span {
	position: relative;

	display: block;

	padding: 17px 0 17px 24px;

	border-top: 1px solid var(--line);

	font-family:
		"Poppins",
		sans-serif;

	font-size: 19px;
	font-weight: 500;

	line-height: 1.3;

	color: var(--white);
}


.storiline-service-section__capabilities-grid span:nth-child(-n+2) {
	border-top: 0;
}


/* ==========================================================
   CAPABILITY MARKER
========================================================== */

.storiline-service-section__capabilities-grid span::before {
	content: "";

	position: absolute;

	left: 0;
	top: 50%;

	width: 7px;
	height: 7px;

	border-radius: 50%;

	background: var(--green-soft);

	transform: translateY(-50%);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 1024px) {

	.storiline-service-section--strategy {
		padding: 80px 0 85px;
	}


	/* ======================================================
	   CURVE
	====================================================== */

	.storiline-service-section__line {
		top: 100px;

		left: -25%;

		width: 62vw;

		height: calc(100% - 20px);
	}


	.storiline-service-section__curve {
		stroke: rgba(255, 255, 255, 0.19);

		stroke-width: 8;
	}


	.storiline-service-section__waypoint {
		scale: 0.82;
	}


	/* ======================================================
	   CONTENT
	====================================================== */

	.storiline-service-section__inner {
		grid-template-columns:
			180px
			minmax(0, 1fr);

		gap: 55px;

		width: 92%;
	}


	.storiline-service-section__name {
		font-size: 38px;
	}


	.storiline-service-section__headline {
		font-size: clamp(40px, 5vw, 55px);
	}


	/* ======================================================
	   BODY
	====================================================== */

	.storiline-service-section__body {
		grid-template-columns: 1fr;

		gap: 20px;

		margin-top: 40px;
	}


	.storiline-service-section__body p {
		font-size: 21px;
	}


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

	.storiline-service-section__capabilities {
		margin-top: 55px;
	}

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767px) {

	.storiline-service-section--strategy {
		padding: 65px 0 70px;
	}


	/* ======================================================
	   CURVE
	====================================================== */

	.storiline-service-section__line {
		top: 92px;

		left: -55%;

		width: 112vw;

		height: calc(100% - 20px);
	}


	.storiline-service-section__curve {
		stroke: rgba(255, 255, 255, 0.17);

		stroke-width: 7;
	}


	.storiline-service-section__waypoint {
		scale: 0.7;
	}


	/* ======================================================
	   CONTENT
	====================================================== */

	.storiline-service-section__inner {
		display: block;

		width: 90%;
	}


	/* ======================================================
	   ASIDE
	====================================================== */

	.storiline-service-section__aside {
		margin-bottom: 42px;
	}


	.storiline-service-section__name {
		font-size: 34px;
	}


	/* ======================================================
	   HEADLINE
	====================================================== */

	.storiline-service-section__headline {
		max-width: none;

		font-size: 40px;

		line-height: 1.08;
	}


	/* ======================================================
	   BODY
	====================================================== */

	.storiline-service-section__body {
		display: block;

		margin-top: 32px;
	}


	.storiline-service-section__body p {
		font-size: 20px;

		line-height: 1.5;
	}


	.storiline-service-section__body p + p {
		margin-top: 18px;
	}


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

	.storiline-service-section__capabilities {
		margin-top: 48px;

		padding-top: 22px;
	}


	.storiline-service-section__capabilities-grid {
		grid-template-columns: 1fr;
	}


	.storiline-service-section__capabilities-grid span {
		padding: 15px 0 15px 22px;

		border-top: 1px solid var(--line);

		font-size: 16px;
	}


	.storiline-service-section__capabilities-grid span:nth-child(2) {
		border-top: 1px solid var(--line);
	}


	.storiline-service-section__capabilities-grid span:first-child {
		border-top: 0;
	}

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 480px) {

	.storiline-service-section__headline {
		font-size: 36px;
	}


	.storiline-service-section__body p {
		font-size: 19px;
	}


	.storiline-service-section__line {
		left: -65%;

		width: 128vw;
	}

}


/* ==========================================================
   REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion: reduce) {

	.storiline-service-section__curve {
		stroke-dasharray: none !important;

		stroke-dashoffset: 0 !important;

		opacity: 1 !important;
	}


	.storiline-service-section__waypoint {
		opacity: 0.55 !important;

		transform: scale(1) !important;
	}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-368e755 *//* ==========================================================
   STORILINE — SERVICES / WEB + DIGITAL
========================================================== */

.storiline-service-web {
	--purple: #704c6d;
	--grey: #4d4d4d;
	--green: #5b8482;
	--black: #252223;
	--white: #ffffff;
	--soft: #f5f4f3;
	--line: #d7d4d3;

	position: relative;

	width: 100%;

	padding: 90px 0 95px;

	background: var(--white);
	color: var(--grey);
}


/* ==========================================================
   INNER
========================================================== */

.storiline-service-web__inner {
	width: min(92%, 1400px);

	margin: 0 auto;
}


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

.storiline-service-web__header {
	display: grid;

	grid-template-columns:
		minmax(240px, 0.52fr)
		minmax(0, 1.48fr);

	gap: clamp(65px, 8vw, 125px);

	align-items: start;
}


/* ==========================================================
   META
========================================================== */

.storiline-service-web__meta {
	display: flex;

	flex-direction: column;

	align-items: flex-start;
}


/* ==========================================================
   NUMBER
========================================================== */

.storiline-service-web__number {
	display: block;

	margin-bottom: 18px;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 24px;
	font-weight: 500;

	line-height: 1;

	letter-spacing: 0.08em;

	color: var(--green);
}


/* ==========================================================
   SECTION NAME
========================================================== */

.storiline-service-web__name {
	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: clamp(38px, 3.7vw, 58px);
	font-weight: 600;

	line-height: 1;

	letter-spacing: -0.045em;

	color: var(--purple);
}


/* ==========================================================
   INTRO
========================================================== */

.storiline-service-web__intro {
	max-width: 920px;
}


/* ==========================================================
   HEADLINE
========================================================== */

.storiline-service-web__headline {
	max-width: 900px;

	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: clamp(44px, 4.5vw, 66px);
	font-weight: 600;

	line-height: 1.05;

	letter-spacing: -0.045em;

	color: var(--black);
}


/* ==========================================================
   LEDE
========================================================== */

.storiline-service-web__lede {
	max-width: 790px;

	margin: 28px 0 0;

	font-family:
		"Source Serif Pro",
		"Source Serif 4",
		Georgia,
		serif;

	font-size: 22px;
	font-weight: 400;

	line-height: 1.5;

	color: var(--grey);
}


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

.storiline-service-web__capabilities {
	display: grid;

	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	gap: 0;

	margin-top: 70px;

	border-top: 1px solid var(--line);
}


/* ==========================================================
   CAPABILITY
========================================================== */

.storiline-service-web__capability {
	min-width: 0;

	padding: 30px 38px 8px 0;
}


.storiline-service-web__capability + .storiline-service-web__capability {
	padding-left: 38px;

	border-left: 1px solid var(--line);
}


/* ==========================================================
   CAPABILITY NUMBER
========================================================== */

.storiline-service-web__capability-number {
	display: block;

	margin-bottom: 22px;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 15px;
	font-weight: 500;

	line-height: 1;

	letter-spacing: 0.07em;

	color: var(--green);
}


/* ==========================================================
   CAPABILITY TITLE
========================================================== */

.storiline-service-web__capability-title {
	max-width: 330px;

	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 28px;
	font-weight: 600;

	line-height: 1.12;

	letter-spacing: -0.03em;

	color: var(--black);
}


/* ==========================================================
   CAPABILITY TEXT
========================================================== */

.storiline-service-web__capability-text {
	max-width: 355px;

	margin: 15px 0 0;

	font-family:
		"Source Serif Pro",
		"Source Serif 4",
		Georgia,
		serif;

	font-size: 18px;
	font-weight: 400;

	line-height: 1.5;

	color: var(--grey);
}


/* ==========================================================
   WORDPRESS STRIP
========================================================== */

.storiline-service-web__wordpress {
	display: grid;

	grid-template-columns:
		minmax(190px, 0.55fr)
		minmax(0, 1.45fr);

	gap: clamp(50px, 7vw, 100px);

	align-items: start;

	margin-top: 55px;

	padding-top: 27px;

	border-top: 1px solid var(--line);
}


/* ==========================================================
   WORDPRESS TITLE
========================================================== */

.storiline-service-web__wordpress-title {
	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 20px;
	font-weight: 600;

	line-height: 1.2;

	letter-spacing: -0.02em;

	color: var(--purple);
}


/* ==========================================================
   WORDPRESS TEXT
========================================================== */

.storiline-service-web__wordpress-text {
	max-width: 800px;

	margin: 0;

	font-family:
		"Source Serif Pro",
		"Source Serif 4",
		Georgia,
		serif;

	font-size: 19px;
	font-weight: 400;

	line-height: 1.5;

	color: var(--grey);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 1024px) {

	.storiline-service-web {
		padding: 70px 0 75px;
	}


	.storiline-service-web__inner {
		width: 92%;
	}


	/* Header */

	.storiline-service-web__header {
		grid-template-columns:
			200px
			minmax(0, 1fr);

		gap: 55px;
	}


	.storiline-service-web__number {
		margin-bottom: 15px;

		font-size: 13px;
	}


	.storiline-service-web__name {
		font-size: 38px;
	}


	.storiline-service-web__headline {
		font-size: clamp(39px, 5vw, 52px);
	}


	.storiline-service-web__lede {
		margin-top: 24px;

		font-size: 20px;
	}


	/* Capabilities */

	.storiline-service-web__capabilities {
		margin-top: 55px;
	}


	.storiline-service-web__capability {
		padding:
			26px
			24px
			6px
			0;
	}


	.storiline-service-web__capability + .storiline-service-web__capability {
		padding-left: 24px;
	}


	.storiline-service-web__capability-number {
		margin-bottom: 18px;

		font-size: 13px;
	}


	.storiline-service-web__capability-title {
		font-size: 23px;
	}


	.storiline-service-web__capability-text {
		margin-top: 13px;

		font-size: 17px;
	}


	/* WordPress */

	.storiline-service-web__wordpress {
		grid-template-columns:
			170px
			minmax(0, 1fr);

		gap: 45px;

		margin-top: 45px;

		padding-top: 24px;
	}


	.storiline-service-web__wordpress-title {
		font-size: 18px;
	}


	.storiline-service-web__wordpress-text {
		font-size: 18px;
	}

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767px) {

	.storiline-service-web {
		padding: 55px 0 60px;
	}


	.storiline-service-web__inner {
		width: 90%;
	}


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

	.storiline-service-web__header {
		display: block;
	}


	.storiline-service-web__meta {
		margin-bottom: 32px;
	}


	.storiline-service-web__number {
		margin-bottom: 12px;

		font-size: 12px;
	}


	.storiline-service-web__name {
		font-size: 34px;
	}


	.storiline-service-web__headline {
		max-width: none;

		font-size: 39px;

		line-height: 1.07;
	}


	.storiline-service-web__lede {
		max-width: none;

		margin-top: 22px;

		font-size: 19px;
	}


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

	.storiline-service-web__capabilities {
		display: block;

		margin-top: 42px;
	}


	.storiline-service-web__capability,
	.storiline-service-web__capability + .storiline-service-web__capability {
		padding: 25px 0;

		border-left: 0;
		border-bottom: 1px solid var(--line);
	}


	.storiline-service-web__capability:last-child {
		border-bottom: 0;
	}


	.storiline-service-web__capability-number {
		margin-bottom: 12px;

		font-size: 12px;
	}


	.storiline-service-web__capability-title {
		max-width: none;

		font-size: 24px;
	}


	.storiline-service-web__capability-text {
		max-width: none;

		margin-top: 10px;

		font-size: 17px;
	}


	/* ======================================================
	   WORDPRESS
	====================================================== */

	.storiline-service-web__wordpress {
		display: block;

		margin-top: 33px;

		padding-top: 23px;
	}


	.storiline-service-web__wordpress-title {
		margin-bottom: 11px;

		font-size: 19px;
	}


	.storiline-service-web__wordpress-text {
		max-width: none;

		font-size: 17px;
	}

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 480px) {

	.storiline-service-web__name {
		font-size: 32px;
	}


	.storiline-service-web__headline {
		font-size: 35px;
	}


	.storiline-service-web__lede {
		font-size: 18px;
	}


	.storiline-service-web__capability-title {
		font-size: 22px;
	}


	.storiline-service-web__capability-text,
	.storiline-service-web__wordpress-text {
		font-size: 16px;
	}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8e89ac1 *//* ==========================================================
   STORILINE — SERVICES / STORYTELLING + CONTENT
========================================================== */

.storiline-service-story {
	--purple: #704c6d;
	--grey: #4d4d4d;
	--green: #5b8482;
	--black: #252223;
	--line: rgba(112, 76, 109, 0.22);
	--soft: #f4f3f2;

	position: relative;

	width: 100%;

	padding: 100px 0 105px;

	overflow: hidden;

	background: var(--soft);

	color: var(--grey);

	isolation: isolate;
}


/* ==========================================================
   BACKGROUND PHOTOGRAPH

   75% opacity
   Anchored bottom left
========================================================== */

.storiline-service-story__photo {
	position: absolute;

	z-index: 0;

	inset: 0;

	background-image:
		url("https://storiline.io/wp-content/uploads/2026/08/DSC0240-2.jpg");

	background-repeat: no-repeat;

	background-position: left bottom;

	background-size: cover;

	opacity: 0.75;

	pointer-events: none;
}


/* ==========================================================
   CONTENT WASH

   Keeps the photograph stronger on the left while gradually
   creating a cleaner reading surface behind the main copy.
========================================================== */

.storiline-service-story::after {
	content: "";

	position: absolute;

	z-index: 1;

	inset: 0;

	background: linear-gradient(
		to right,
		rgba(244, 243, 242, 0.08) 0%,
		rgba(244, 243, 242, 0.18) 24%,
		rgba(244, 243, 242, 0.72) 43%,
		rgba(244, 243, 242, 0.91) 62%,
		rgba(244, 243, 242, 0.96) 100%
	);

	pointer-events: none;
}


/* ==========================================================
   INNER
========================================================== */

.storiline-service-story__inner {
	position: relative;

	z-index: 2;

	display: grid;

	grid-template-columns:
		minmax(220px, 0.7fr)
		minmax(0, 2fr);

	gap: clamp(70px, 9vw, 150px);

	align-items: start;

	width: min(92%, 1400px);

	margin: 0 auto;
}


/* ==========================================================
   ASIDE
========================================================== */

.storiline-service-story__aside {
	display: flex;

	flex-direction: column;

	align-items: flex-start;
}


/* ==========================================================
   SERVICE NAME
========================================================== */

.storiline-service-story__name {
	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: clamp(38px, 3.7vw, 58px);
	font-weight: 600;

	line-height: 1.05;

	letter-spacing: -0.045em;

	color: var(--purple);
}


/* ==========================================================
   MAIN
========================================================== */

.storiline-service-story__main {
	min-width: 0;
}


/* ==========================================================
   LARGE STATEMENT
========================================================== */

.storiline-service-story__statement {
	max-width: 1000px;

	margin: -8px 0 0;

	font-family:
		"Source Serif Pro",
		"Source Serif 4",
		Georgia,
		serif;

	font-size: clamp(40px, 3.9vw, 58px);
	font-weight: 400;

	line-height: 1.1;

	letter-spacing: -0.025em;

	color: var(--black);
}


/* ==========================================================
   INTRO
========================================================== */

.storiline-service-story__intro {
	max-width: 760px;

	margin-top: 42px;
}


.storiline-service-story__intro p {
	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 19px;
	font-weight: 400;

	line-height: 1.6;

	letter-spacing: -0.01em;

	color: var(--grey);
}


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

.storiline-service-story__capabilities {
	display: grid;

	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	margin-top: 58px;

	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);

	background: rgba(244, 243, 242, 0.35);

	backdrop-filter: blur(1px);
	-webkit-backdrop-filter: blur(1px);
}


/* ==========================================================
   CAPABILITY
========================================================== */

.storiline-service-story__capability {
	display: flex;

	flex-direction: column;

	min-height: 285px;

	padding: 30px;

	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);

	background: transparent;
}


/* ==========================================================
   CAPABILITY TOP
========================================================== */

.storiline-service-story__capability-top {
	display: block;

	width: 100%;
}


/* ==========================================================
   CAPABILITY TITLE
========================================================== */

.storiline-service-story__capability h3 {
	max-width: 430px;

	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 24px;
	font-weight: 600;

	line-height: 1.15;

	letter-spacing: -0.03em;

	color: var(--black);
}


/* ==========================================================
   CAPABILITY DESCRIPTION
========================================================== */

.storiline-service-story__capability > p {
	max-width: 470px;

	margin: 20px 0 30px;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 18px;
	font-weight: 400;

	line-height: 1.55;

	letter-spacing: -0.005em;

	color: var(--grey);
}


/* ==========================================================
   TAGS
========================================================== */

.storiline-service-story__tags {
	display: flex;

	flex-wrap: wrap;

	gap: 8px;

	margin-top: auto;
}


.storiline-service-story__tags span {
	display: inline-block;

	padding: 7px 10px;

	border: 1px solid rgba(112, 76, 109, 0.32);

	font-family:
		"Poppins",
		sans-serif;

	font-size: 12px;
	font-weight: 500;

	line-height: 1;

	letter-spacing: 0.01em;

	color: var(--purple);

	background: rgba(244, 243, 242, 0.38);
}


/* ==========================================================
   EXIF / PHOTOGRAPH METADATA

   Single translucent white information strip.
========================================================== */

.storiline-service-story__exif {
	position: absolute;

	z-index: 3;

	left: max(4%, calc((100% - 1400px) / 2));
	bottom: 28px;

	display: flex;

	flex-wrap: nowrap;

	align-items: center;

	width: max-content;
	max-width: calc(100% - 8%);

	padding: 14px 20px;

	background: rgba(255, 255, 255, 0.50);

	font-family:
		"Poppins",
		sans-serif;

	font-size: 10px;
	font-weight: 500;

	line-height: 1;

	letter-spacing: 0.08em;

	text-transform: uppercase;

	color: rgba(37, 34, 35, 0.88);

	pointer-events: none;
}


/* ==========================================================
   EXIF VALUES
========================================================== */

.storiline-service-story__exif span {
	display: flex;

	align-items: center;

	white-space: nowrap;
}


/* ==========================================================
   EXIF SEPARATORS
========================================================== */

.storiline-service-story__exif span:not(:last-child)::after {
	content: "·";

	display: inline-block;

	margin: 0 18px;

	font-size: 11px;

	color: var(--purple);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 1024px) {

	.storiline-service-story {
		padding: 80px 0 100px;
	}


	/* Background */

	.storiline-service-story__photo {
		background-position: 25% bottom;

		opacity: 0.75;
	}


	/* Content wash */

	.storiline-service-story::after {
		background: linear-gradient(
			to right,
			rgba(244, 243, 242, 0.16) 0%,
			rgba(244, 243, 242, 0.36) 28%,
			rgba(244, 243, 242, 0.82) 48%,
			rgba(244, 243, 242, 0.95) 100%
		);
	}


	/* Layout */

	.storiline-service-story__inner {
		grid-template-columns:
			180px
			minmax(0, 1fr);

		gap: 55px;

		width: 92%;
	}


	/* Service identifier */

	.storiline-service-story__name {
		font-size: 38px;
	}


	/* Statement */

	.storiline-service-story__statement {
		font-size: clamp(36px, 4.6vw, 50px);

		line-height: 1.12;
	}


	/* Intro */

	.storiline-service-story__intro {
		max-width: 650px;

		margin-top: 34px;
	}


	.storiline-service-story__intro p {
		font-size: 18px;

		line-height: 1.6;
	}


	/* Capabilities */

	.storiline-service-story__capabilities {
		margin-top: 50px;
	}


	.storiline-service-story__capability {
		min-height: 250px;

		padding: 25px;
	}


	.storiline-service-story__capability h3 {
		font-size: 22px;
	}


	.storiline-service-story__capability > p {
		max-width: none;

		margin-top: 17px;

		font-size: 17px;

		line-height: 1.58;
	}


	/* EXIF */

	.storiline-service-story__exif {
		left: 4%;
		bottom: 22px;

		max-width: 92%;

		padding: 12px 16px;

		font-size: 9px;
	}


	.storiline-service-story__exif span:not(:last-child)::after {
		margin: 0 13px;

		font-size: 10px;
	}

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767px) {

	.storiline-service-story {
		padding: 65px 0 110px;
	}


	/* Background */

	.storiline-service-story__photo {
		background-position: 30% bottom;

		opacity: 0.75;
	}


	/*
	 * Vertical wash gives the text more separation while
	 * allowing the photograph to become stronger toward
	 * the bottom of the section.
	 */

	.storiline-service-story::after {
		background: linear-gradient(
			to bottom,
			rgba(244, 243, 242, 0.88) 0%,
			rgba(244, 243, 242, 0.84) 52%,
			rgba(244, 243, 242, 0.68) 76%,
			rgba(244, 243, 242, 0.28) 100%
		);
	}


	/* Layout */

	.storiline-service-story__inner {
		display: block;

		width: 90%;
	}


	/* ======================================================
	   SERVICE IDENTIFIER
	====================================================== */

	.storiline-service-story__aside {
		margin-bottom: 38px;
	}


	.storiline-service-story__name {
		font-size: 34px;

		line-height: 1.05;
	}


	/* ======================================================
	   STATEMENT
	====================================================== */

	.storiline-service-story__statement {
		max-width: none;

		margin-top: 0;

		font-size: 34px;

		line-height: 1.13;

		letter-spacing: -0.02em;
	}


	/* ======================================================
	   INTRO
	====================================================== */

	.storiline-service-story__intro {
		max-width: none;

		margin-top: 28px;
	}


	.storiline-service-story__intro p {
		font-size: 17px;

		line-height: 1.6;
	}


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

	.storiline-service-story__capabilities {
		grid-template-columns: 1fr;

		margin-top: 42px;

		background: rgba(244, 243, 242, 0.52);
	}


	.storiline-service-story__capability {
		min-height: 0;

		padding: 24px 22px;
	}


	.storiline-service-story__capability-top {
		display: block;
	}


	.storiline-service-story__capability h3 {
		max-width: none;

		font-size: 22px;
	}


	.storiline-service-story__capability > p {
		max-width: none;

		margin: 16px 0 25px;

		font-size: 17px;

		line-height: 1.58;
	}


	.storiline-service-story__tags {
		margin-top: 0;
	}


	/* ======================================================
	   EXIF
	====================================================== */

	.storiline-service-story__exif {
		left: 5%;
		right: auto;
		bottom: 25px;

		width: auto;
		max-width: 90%;

		padding: 11px 13px;

		font-size: 8px;

		letter-spacing: 0.06em;

		background: rgba(255, 255, 255, 0.50);

		color: rgba(37, 34, 35, 0.88);
	}


	.storiline-service-story__exif span:not(:last-child)::after {
		margin: 0 8px;

		font-size: 9px;
	}

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 480px) {

	.storiline-service-story__name {
		font-size: 32px;
	}


	.storiline-service-story__statement {
		font-size: 32px;
	}


	/*
	 * Allow the EXIF line to remain contained on narrow
	 * screens without making the box excessively tall.
	 */

	.storiline-service-story__exif {
		max-width: 90%;

		padding: 10px 11px;

		font-size: 7px;

		letter-spacing: 0.04em;
	}


	.storiline-service-story__exif span:not(:last-child)::after {
		margin: 0 6px;

		font-size: 8px;
	}

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-90f929f *//* ==========================================================
   STORILINE — SERVICES / CREATIVE + DESIGN
========================================================== */

.storiline-service-creative {
	--purple: #704c6d;
	--grey: #4d4d4d;
	--green: #5b8482;
	--black: #252223;
	--line: #d7d4d3;
	--soft: #f4f3f2;
	--purple-soft: rgba(112, 76, 109, 0.06);

	position: relative;

	width: 100%;

	padding: 95px 0 100px;

	background: #ffffff;

	color: var(--grey);
}


/* ==========================================================
   INNER
========================================================== */

.storiline-service-creative__inner {
	width: min(92%, 1400px);

	margin: 0 auto;
}


/* ==========================================================
   SECTION INTRO
========================================================== */

.storiline-service-creative__intro-block {
	width: 100%;

	max-width: 1180px;

	margin-bottom: 65px;
}


/* ==========================================================
   SERVICE NAME
========================================================== */

.storiline-service-creative__name {
	margin: 0 0 28px;

	font-family:
		"Poppins",
		sans-serif;

	font-size: clamp(38px, 3.7vw, 58px);
	font-weight: 600;

	line-height: 1.05;

	letter-spacing: -0.045em;

	color: var(--purple);
}


/* ==========================================================
   HEADLINE
========================================================== */

.storiline-service-creative__headline {
	max-width: 1050px;

	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: clamp(44px, 4.5vw, 68px);
	font-weight: 600;

	line-height: 1.05;

	letter-spacing: -0.045em;

	color: var(--black);
}


/* ==========================================================
   INTRO
========================================================== */

.storiline-service-creative__intro {
	max-width: 930px;

	margin: 34px 0 0;

	font-family:
		"Source Serif Pro",
		"Source Serif 4",
		Georgia,
		serif;

	font-size: 24px;
	font-weight: 400;

	line-height: 1.5;

	letter-spacing: -0.01em;

	color: var(--grey);
}


/* ==========================================================
   CAPABILITY GRID
========================================================== */

.storiline-service-creative__grid {
	display: grid;

	grid-template-columns:
		repeat(2, minmax(0, 1fr));

	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}


/* ==========================================================
   CAPABILITY ITEM
========================================================== */

.storiline-service-creative__item {
	display: flex;

	flex-direction: column;

	justify-content: flex-start;

	min-height: 205px;

	padding: 38px 42px;

	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);

	background: #ffffff;
}


/* ==========================================================
   CAPABILITY TITLE
========================================================== */

.storiline-service-creative__item h4 {
	max-width: 600px;

	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 27px;
	font-weight: 600;

	line-height: 1.18;

	letter-spacing: -0.03em;

	color: var(--black);
}


/* ==========================================================
   CAPABILITY DESCRIPTION
========================================================== */

.storiline-service-creative__item p {
	max-width: 580px;

	margin: 20px 0 0;

	font-family:
		"Source Serif Pro",
		"Source Serif 4",
		Georgia,
		serif;

	font-size: 20px;
	font-weight: 400;

	line-height: 1.48;

	letter-spacing: -0.005em;

	color: var(--grey);
}


/* ==========================================================
   CREATIVE PARTNERSHIP
========================================================== */

.storiline-service-creative__partner {
	display: grid;

	grid-template-columns:
		minmax(220px, 0.65fr)
		minmax(0, 1.75fr);

	gap: clamp(50px, 7vw, 110px);

	align-items: start;

	margin-top: 42px;

	padding: 38px 42px;

	background: var(--purple-soft);
}


/* ==========================================================
   PARTNERSHIP TITLE
========================================================== */

.storiline-service-creative__partner-title {
	margin: 0;

	font-family:
		"Poppins",
		sans-serif;

	font-size: 24px;
	font-weight: 600;

	line-height: 1.2;

	letter-spacing: -0.02em;

	color: var(--purple);
}


/* ==========================================================
   PARTNERSHIP TEXT
========================================================== */

.storiline-service-creative__partner-text {
	max-width: 850px;

	margin: 0;

	font-family:
		"Source Serif Pro",
		"Source Serif 4",
		Georgia,
		serif;

	font-size: 19px;
	font-weight: 400;

	line-height: 1.55;

	color: var(--grey);
}


/* ==========================================================
   TABLET
========================================================== */

@media (max-width: 1024px) {

	.storiline-service-creative {
		padding: 75px 0 80px;
	}


	.storiline-service-creative__inner {
		width: 92%;
	}


	.storiline-service-creative__intro-block {
		margin-bottom: 52px;
	}


	.storiline-service-creative__name {
		font-size: 38px;

		margin-bottom: 24px;
	}


	.storiline-service-creative__headline {
		max-width: 850px;

		font-size: clamp(40px, 5.4vw, 56px);
	}


	.storiline-service-creative__intro {
		max-width: 800px;

		margin-top: 28px;

		font-size: 21px;
	}


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

	.storiline-service-creative__item {
		min-height: 190px;

		padding: 32px;
	}


	.storiline-service-creative__item h4 {
		font-size: 24px;
	}


	.storiline-service-creative__item p {
		margin-top: 17px;

		font-size: 18px;
	}


	/* ======================================================
	   PARTNERSHIP
	====================================================== */

	.storiline-service-creative__partner {
		grid-template-columns:
			190px
			minmax(0, 1fr);

		gap: 45px;

		margin-top: 35px;

		padding: 32px;
	}


	.storiline-service-creative__partner-title {
		font-size: 22px;
	}


	.storiline-service-creative__partner-text {
		font-size: 18px;
	}

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 767px) {

	.storiline-service-creative {
		padding: 60px 0 65px;
	}


	.storiline-service-creative__inner {
		width: 90%;
	}


	.storiline-service-creative__intro-block {
		margin-bottom: 42px;
	}


	.storiline-service-creative__name {
		margin-bottom: 22px;

		font-size: 34px;
	}


	.storiline-service-creative__headline {
		font-size: 36px;

		line-height: 1.08;
	}


	.storiline-service-creative__intro {
		margin-top: 24px;

		font-size: 19px;

		line-height: 1.5;
	}


	/* ======================================================
	   CAPABILITY GRID
	====================================================== */

	.storiline-service-creative__grid {
		grid-template-columns: 1fr;
	}


	.storiline-service-creative__item {
		min-height: 0;

		padding: 28px 24px;
	}


	.storiline-service-creative__item h4 {
		font-size: 23px;
	}


	.storiline-service-creative__item p {
		max-width: none;

		margin-top: 14px;

		font-size: 18px;

		line-height: 1.5;
	}


	/* ======================================================
	   PARTNERSHIP
	====================================================== */

	.storiline-service-creative__partner {
		display: block;

		margin-top: 30px;

		padding: 28px 24px;
	}


	.storiline-service-creative__partner-title {
		margin-bottom: 15px;

		font-size: 22px;
	}


	.storiline-service-creative__partner-text {
		max-width: none;

		font-size: 18px;

		line-height: 1.55;
	}

}


/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width: 480px) {

	.storiline-service-creative__name {
		font-size: 32px;
	}


	.storiline-service-creative__headline {
		font-size: 33px;
	}


	.storiline-service-creative__item {
		padding: 25px 21px;
	}


	.storiline-service-creative__partner {
		padding: 25px 21px;
	}

}/* End custom CSS */