/* general settings */

#page-container h1,
#page-container h2,
#page-container h3,
#page-container h4,
#main-content h5,
#page-container h6 {
  font-family: var(--ff-main) !important;
  color: var(--plnb-clr-heading) !important;
}
html,
body,
li,
ul,
ol,
#page-container p {
  font-family: var(--ff-main)!important;
  color: var(--plnb-clr-paragraph);
}

#page-container h1 {
  font-size: var(--plnb-fs-h1) !important;
  font-weight: var(--plnb-fw-h1) !important;
  line-height: var(--plnb-lh-h1) !important;
  letter-spacing: var(--plnb-ls-h1) !important;
}
#page-container h1.big {
  font-size: var(--plnb-fs-h1-big) !important;
  font-weight: var(--plnb-fw-h1-big) !important;
  line-height: var(--plnb-lh-h1-big) !important;
  letter-spacing: var(--plnb-ls-h1-big) !important;
}
#page-container h2 {
  font-size: var(--plnb-fs-h2)!important;
  font-weight: var(--plnb-fw-h2) !important;
  line-height: var(--plnb-lh-h2) !important;
  letter-spacing: var(--plnb-ls-h2) !important;
}
#page-container h2.big {
  font-size: var(--plnb-fs-h1)!important;
  font-weight: var(--plnb-fw-h1)!important;
  line-height: var(--plnb-lh-h1)!important;
  letter-spacing: var(--plnb-ls-h1)!important;
}
#page-container h3 {
  font-size: var(--plnb-fs-h3)!important;
  font-weight: var(--plnb-fw-h3) !important;
  line-height: var(--plnb-lh-h3) !important;
  letter-spacing: var(--plnb-ls-h3) !important;
}
#page-container h4 {
  font-size: var(--plnb-fs-h4)!important;
  font-weight: var(--plnb-fw-h4) !important;
  line-height: var(--plnb-lh-h4) !important;
  letter-spacing: var(--plnb-ls-h4) !important;
}
#main-content h5 {
  font-size: var(--plnb-fs-h5) !important;
  font-weight: var(--plnb-fw-h5) !important;
  line-height: var(--plnb-lh-h5) !important;
  letter-spacing: var(--plnb-ls-h5) !important;
}
#page-container h6 {
  font-size: var(--plnb-fs-h6)!important;
  font-weight: var(--plnb-fw-h6) !important;
  line-height: var(--plnb-lh-h6) !important;
  letter-spacing: var(--plnb-ls-h6) !important;
}

#page-container p {
  font-size: var(--plnb-fs-p)!important;
  font-weight: var(--plnb-fw-p)!important;
  line-height: var(--plnb-lh-p)!important;
  letter-spacing: var(--plnb-ls-p)!important;
}
#page-container p.small {
  font-size: var(--plnb-fs-p-small)!important;
  font-weight: var(--plnb-fw-p-small)!important;
  line-height: var(--plnb-lh-p-small)!important;
  letter-spacing: var(--plnb-ls-p-small)!important;
}
#page-container p.big {
  font-size: var(--plnb-fs-p-big)!important;
  font-weight: var(--plnb-fw-p-big)!important;
  line-height: var(--plnb-lh-p-big)!important;
  letter-spacing: var(--plnb-ls-p-big)!important;
}
#page-container p.subheading {
  font-size: var(--plnb-fs-subh)!important;
  font-weight: var(--plnb-fw-subh)!important;
  line-height: var(--plnb-lh-subh)!important;
  letter-spacing: var(--plnb-ls-subh)!important;
}
#page-container p.label {
  font-size: var(--plnb-fs-p-label)!important;
  font-weight: var(--plnb-fw-p-label)!important;
  line-height: var(--plnb-lh-p-label)!important;
  letter-spacing: var(--plnb-ls-p-label)!important;
}
/* end general settings */


.hero-section .subtitle {
	text-align: center!important;
	font-family: Gilroy!important;
	font-size: 18px!important;
	font-style: normal!important;
	font-weight: 600!important;
	line-height: 160%!important; 
	padding-bottom:0px!important;
}

.hero-section  .et_pb_module.et_pb_text {
	margin-bottom:44px!important;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row {
	max-width: 1302px!important;
	margin-inline:auto!important;
	border-radius: 32px;
	background: var(--plnb-clr-green-200);
	padding:73px 30px 32px 57px!important;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row  .et_pb_column {
	display:flex;
	align-items:start;
	gap:70px;
}


.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column {
	max-width:306px!important;
	margin-bottom:0px!important;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .button-container {
	height:min-content!important;
	display:flex;
	padding-top: 22px!important;
}
.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column h2 {
	padding-block: 19px 30px!important;
}
#page-container #et-boc .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .plnb-button-primary {
	padding:30px 22px!important; 
	color: #FFF!important;
	background-color: var(--plnb-clr-green-sat)!important;
text-align: center!important;
font-family: Gilroy!important;
font-size: 18px!important;
font-style: normal!important;
font-weight: 700!important;
line-height: 100%!important; /* 18px */
letter-spacing: 0.5px!important;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item:first-of-type {
	padding-bottom:2em!important;
}
.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item:nth-of-type(2) {
	padding-bottom:3em!important;
}
#page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item {
	color: #1D1D1F!important;
	font-size: 16px!important;
	font-style: normal!important;
	font-weight: 400!important;
	line-height: 161.9%!important;
	max-width:372px!important;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-cards-container {
	display:grid;
	grid-template-columns:repeat(2, 1fr);
	column-gap:14px;
	row-gap: 16px;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .et_pb_column::after {
	display:none!important;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column {
	width:100%!important;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card {
	padding:12px 15px!important;
	display:flex;
	align-items:end;
	justify-content:end;
	position:relative;
	border-radius: 20px;
	min-height:241px!important;
	
}
.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card .logo {
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%, -50%)!important;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card.white {
	background-color:white!important;
	
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card.black {
	background-color:var(--plnb-clr-neutral-900)!important;
	
}
.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card.black .download-text {
color: var(--plnb-clr-neutral-50)!important;
	}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card a {
	display:flex;
	align-items:center;
	gap:8px;
}


.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card a .download-text {
	opacity:0;
	visibility:hidden;
	max-width:0;
	transition: opacity 0.3s ease, max-width 0.2s ease;
}
.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card a:hover .download-text {
	opacity:1;
	visibility:visible;
	max-width:300px;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card {
	border-radius: 20px;
	min-height:157px;
	padding:12px 15px!important;
	display:flex;
	align-items:end;
	justify-content:end;
	position:relative;

}
.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card a {
	display:flex;
	gap:8px;
	align-items:center;
	flex-direction:row!important;
}
.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card .logo {
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%, -50%);
}
.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card.white {
	background-color:#fff;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card.white {
	background-color:#fff;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card.black {
	background-color:var(--plnb-clr-neutral-900)!important;
}
#page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .three-columns-title {
	text-align:center;
	margin-block:27px 14px!important;
	color: #1D1D1F!important;
	font-family: Gilroy!important;
	font-size: 16px!important;
	font-style: normal!important;
	font-weight: 700!important;
	line-height: 161.9%!important; 
}
.wordmark-and-symbol-section .wordmark-and-symbol-row .small-cards-container {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:14px;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card a .download-text {
	opacity:0;
	visibility:hidden;
	max-width:0;
	transition: opacity 0.3s ease, max-width 0.2s ease;
}
.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card a:hover .download-text {
	opacity:1;
	visibility:visible;
	max-width:300px;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card.black .download-text {
color: var(--plnb-clr-neutral-50)!important;
	}



.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card:first-of-type::before {
	content:"Primary";
	color: #1D1D1F!important;
	font-family: Gilroy!important;
	font-size: 16px!important;
	font-style: normal!important;
	font-weight: 700!important;
	line-height: 161.9%!important; 
	position:absolute;
	left:0;
	top:-40px;
}

.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card:nth-of-type(2)::before {
	content:"Monochrome";
	color: #1D1D1F!important;
	font-family: Gilroy!important;
	font-size: 16px!important;
	font-style: normal!important;
	font-weight: 700!important;
	line-height: 161.9%!important; 
	position:absolute;
	left:0;
	top:-40px;
}
.hero-section, .wordmark-and-symbol-section, 
.what-to-avoid-section, .color-palette-section, .planable-in-action-section {
	background-color: #F2F3F6!important;
}


.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column  {
	display:grid;
	grid-template-columns:repeat(4, 1fr);
	gap:13px;
}

.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column  .card-container {
	background-color: white!important;
	height:220px;
	display:flex;
	justify-content:center;
	align-items:center;
	border-radius: 20px;
}

.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column  .card-container .tooltip-item {
	position:absolute;
	right:0px;
	top:0px;
	z-index:0;
	opacity:0;
	visibility:hidden;
	z-index:999;
}

.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container:hover .tooltip-item {
	opacity:1;
	visibility:visible;
}


.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container .tooltip-item::before {
	    content: "";
    background-image: url(/wp-content/uploads/2025/07/Group-2925.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    height: 97px;
    display: block;
    position: absolute;
    left: 50%;
    top: 60%;
	transform:translate(-50%, -50%);
    z-index: -1;
	width:202px;
}
#page-container .what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container .tooltip-item .tootltip-text {
	max-width:165px!important;
	color: #FFF!important;
	font-family: Gilroy!important;
	font-size: 14px!important;
	font-style: normal!important;
	font-weight: 500!important;
	line-height: 161.9%!important;
}

.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container .et_pb_code_inner, 
.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container .et_pb_code_inner .card-item {
	min-width:100%!important;
	min-height:100%!important;
	display:flex;
	justify-content:center;
	align-items:center;
}

.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container::before {
	content:"";
	position:absolute;
	left:14px;
	top:20px;
	background-image: url(/wp-content/uploads/2025/07/Group-27.svg);
	background-size:contain;
	background-repeat:no-repeat;
	width:43px;
	height:43px;
}

.what-to-avoid-section .what-to-avoid-cards-row {
	max-width:1302px!important;
	margin-inline:auto!important;
} 

.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container:nth-of-type(9) {
	background-color: #F29766!important;
}
.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container:nth-of-type(10) {
	background-color: #064832!important;
}
.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container:nth-of-type(11) {
	background-color: #DEDEDE!important;
}
.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container:nth-of-type(12) {
	background-color: unset!important;
	background-image:url(/wp-content/uploads/2025/07/kateryna-hliznitsova-BnHJf5bx6zY-unsplash-1.png);
	background-size:cover;

}


.color-palette-section .color-palette-row {
	max-width:1302px!important;
	margin-inline:auto!important;
	border-radius: 32px;
background: #FFF;
	padding: 93px 30px 60px 55px!important;
}

#page-container .color-palette-section .color-palette-row .color-palette-text-column p{
	max-width:285px!important;
	color: #1D1D1F!important;
/* 	font-family: Poppins!important; */
	font-size: 16px!important;
	font-style: normal!important;
	font-weight: 400!important;
	line-height: 161.9%!important; 
}
#page-container #et-boc  .color-palette-section .color-palette-row .color-palette-text-column {
	    margin-bottom: 0px !important;
	max-width: 314px;
    width: 100%;
}
#page-container #et-boc  .color-palette-section .color-palette-row .color-palette-text-column h2 {
	padding-bottom:28px!important;
}
#page-container #et-boc  .color-palette-section .color-palette-row .color-palette-text-column  .description-item:first-of-type {
	padding-bottom:2em!important;
}
#page-container #et-boc  .color-palette-section .color-palette-row .color-palette-text-column .plnb-button-primary  {
	padding:30px 21px!important;
}

.color-palette-section .color-palette-row .color-palette-text-column .button-container {
	display:flex;
	padding-top:32px!important;
}

.color-palette-section .color-palette-row .et_pb_column {
	display:flex;
	align-items:start;
	gap:70px;
}

.color-palette-section .color-palette-row .color-codes-container {
	display:grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 35px;
}

.color-palette-section .color-palette-row .color-codes-container .color-code {
	width:138px;
	height:514px;
	border-radius: 10px;
	position:relative;
	cursor:pointer;

}

.color-palette-section .color-palette-row .color-codes-container .color-code.peach {
	background-color: var(--plnb-clr-orange-500);
}

.color-palette-section .color-palette-row .color-codes-container .color-code.lavander {
	background-color: var(--plnb-clr-purple-500);
}
.color-palette-section .color-palette-row .color-codes-container .color-code.mint {
	background-color: var(--plnb-clr-green-500);
}
.color-palette-section .color-palette-row .color-codes-container .color-code.breeze {
	background-color: var(--plnb-clr-blue-500);
}
.color-palette-section .color-palette-row .color-codes-container .color-code.coral {
	background-color: var(--plnb-clr-red-500);
}


.color-palette-section .color-palette-row .color-codes-container .color-code .color-code-text-container {
	position: absolute;
        bottom: 0px;
    left: 37px;
    transform: rotate(-90deg);
	transform-origin:left;
}
.color-palette-section .color-palette-row .color-codes-container .color-code .color-code-text-container p {
	padding:0px!important;
}
#page-container .color-palette-section .color-palette-row .color-codes-container .color-code .color-code-text-container p.color-name {
color: #1D1D1F!important;
font-family: Gilroy!important;
font-size: 16px!important;
font-style: normal!important;
font-weight: 700!important;
line-height: 100%!important;
	padding-bottom:8px!important;
}
#page-container .color-palette-section .color-palette-row .color-codes-container .color-code .color-code-text-container p.color-code-text{
color: #1D1D1F!important;
font-family: Gilroy!important;
font-size: 16px!important;
font-style: normal!important;
font-weight: 400!important;
line-height: 92.4%!important; 

}

.color-palette-section .color-palette-row .color-codes-container .color-code .color-tooltip {
	background-color:#12131A!important;
	padding:10px 16px!important;
	color: #FFF!important;
font-family: Gilroy!important;
font-size: 14px!important;
font-style: normal!important;
font-weight: 500!important;
line-height: 161.9%!important;
	position:absolute;
	border-radius: 12px;
	right:-84px;
	top:56px;
	    width: 138px;
    text-align: center;
	opacity:0;
	visibility:hidden;
	transition:all 0.1s ease-in-out;
	z-index:999;

}
.color-palette-section .color-palette-row .color-codes-container .color-code:hover .color-tooltip {
	opacity:1;
	visibility:visible;
}

.color-palette-section .color-palette-row .color-codes-container .color-code .color-tooltip::before {
	content:"";
	position:absolute;
	width:18px;
	height:18px;
	left: 12px;
    bottom: -5px;
	border-radius: 3px;
	background:  #12131A;
	transform: rotate(45deg);
		
}


#page-container .prefooter-text-content {
	color: #FFF!important;
	text-align: center!important;
	font-family: Gilroy!important;
	font-size: 61px!important;
	font-style: normal!important;
	font-weight: 700!important;
	line-height: 110%!important; 
	padding-bottom:20px!important;
}

#page-container .prefooter-text-description {
	color: #FFF!important;
	text-align: center!important;
	font-family: Gilroy!important;
	font-size: 18px!important;
	font-style: normal!important;
	font-weight: 600!important;
	line-height: 160%!important; 
}
#page-container #et-boc  .plnb-prefooter-row {
	padding-bottom:40px!important;
}
#page-container #et-boc .buttons-row .et_pb_button_module_wrapper:has(.plnb-button-primary) {
	margin-bottom: 16px!important;
}
#page-container #et-boc .hero-section h1 {
	padding-bottom:15px!important;
}
#page-container #et-boc .hero-section p {
	color: #2F313D!important;
	text-align: center!important;
	font-family: Gilroy!important;
	font-size: 18px!important;
	font-style: normal!important;
	font-weight: 600!important;
	line-height: 160%!important; 
}
.hero-section {
	padding-block: 80px 0px!important;
}
.color-palette-section {
	padding-block: 110px 0px!important;
}
.wordmark-and-symbol-section {
	padding-block:115px 0px!important;
}
.what-to-avoid-section {
	padding-block: 95px 0px!important;
}
.planable-in-action-section {
	padding-block:160px!important;
}
.planable-in-action-row {
	padding-block:0px!important;
}
	
#page-container .what-to-avoid-section .what-to-avoid-title-row p.subtitle {
	color: #2F313D!important;
	text-align: center!important;
	font-family: Gilroy!important;
	font-size: 18px!important;
	font-style: normal!important;
	font-weight: 600!important;
	line-height: 160%!important; 
}
.hero-section a.plnb-button-primary {
	max-width:max-content!important;
	margin-inline:auto!important;
}

#page-container div.plnb-prefooter-section {
	background-color:#F2F3F6!important;
}
#page-container .planable-in-action-row p {
	color: #2F313D!important;
	text-align: center!important;
	font-family: Gilroy;
	font-size: 18px!important;
	font-style: normal!important;
	font-weight: 600!important;
	line-height: 160%!important; 
}

#page-container #et-boc .plnb-prefooter-section .plnb-button-primary {
	padding:30px!important;
}

#page-container .planable-in-action-row h2 {
	color: #12131A!important;
	text-align: center!important;
	font-size: 39px!important;
	font-style: normal!important;
	font-weight: 700!important;
	line-height: 120%!important; 
}

#page-container .planable-in-action-row .plnb-button-primary  {
	padding:30px 26px!important;
	max-width:max-content!important;
}

.product-hero-tour-row {
	padding-top:34px!important;
}

.button-container {
	display:flex;
	max-width:max-content;
}
.hero-section .button-container{
	margin-inline:auto!important;
}

.buttons-row  .button-container {
	margin-inline:auto!important;
}

@media(max-width:1366px) {
/* 	.color-palette-section .color-palette-row::after, .wordmark-and-symbol-section .wordmark-and-symbol-row::after {
		display:none!important;
	} */
	
	.color-palette-section .color-palette-row .color-codes-container .color-code .color-tooltip {
		right:-35px!important;
	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container .tooltip-item {
		right:12px;
	}
	.what-to-avoid-section .what-to-avoid-cards-row, .wordmark-and-symbol-section .wordmark-and-symbol-row, .color-palette-section .color-palette-row {
		max-width:1280px!important;
	}
	.color-palette-section .color-palette-row .et_pb_column {
		gap:40px!important;
	}
}

@media(max-width:1280px) {
	#page-container #et-boc .hero-section h1 br{
		display:block!important;
	}
	.color-palette-section .color-palette-row .color-codes-container .color-code {
    width: 110px;
	}
	#page-container .color-palette-section .color-palette-row .color-codes-container .color-code .color-code-text-container p.color-name {
		white-space:nowrap!important;
	}
}

@media(min-width:1025) and (max-width:1280px) {
	#page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item {
	 max-width: 275px !important;
	}
}
@media(min-width:1024px) {
	#page-container #et-boc .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .plnb-button-primary {
		white-space:nowrap!important;
	}
}

@media(max-width:1024px) {
	#page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item {
	 max-width: 100% !important;
	} 
	.wordmark-and-symbol-section .wordmark-and-symbol-row {
	padding: 53px 30px 32px 30px!important	
	}
	.color-palette-section .color-palette-row {
		padding: 93px 30px 60px 30px!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .et_pb_column {
		flex-direction:column!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column {
		max-width:100%!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .et_pb_column {
		gap:100px;
	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column {
		    grid-template-columns: repeat(3, 1fr);
	}
	.color-palette-section .color-palette-row .et_pb_column {
		flex-direction:column!important;
	}
	#page-container #et-boc .color-palette-section .color-palette-row .color-palette-text-column {
		max-width:100%!important;
	}
	#page-container .color-palette-section .color-palette-row .color-palette-text-column p {
		max-width:unset!important;
	}
	.color-palette-colors-column {
		margin-inline:auto!important;
	}
	.color-palette-section .color-palette-row .et_pb_column {
		gap:70px!important;
	}
}

@media(max-width:980px) {
	.color-palette-section .color-palette-row .color-palette-text-column .button-container {
		justify-content:center!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .button-container {
		justify-content:center!important;
	}
	div.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item, .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item:first-of-type, .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item:nth-of-type(2) {
		padding-bottom:1em!important;
	}
	
	.wordmark-and-symbol-section {
    padding-block: 60px 0px !important;
}
	.wordmark-and-symbol-section .wordmark-and-symbol-row {
		padding:43px 30px 32px 30px!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card a {
		opacity:0!important;
	}
	
		.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card a {
		opacity:0!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card a::before {
		content:"";
		position:absolute;
		left:0;
		top:0;
		width:100%;
		height:100%;
	}
	.what-to-avoid-section .what-to-avoid-title-row {
		padding-bottom:48px!important;
	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container {
		margin-bottom:0px!important;
	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container::before {
		width:33px;
		height:33px;
	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container .tooltip-item {
		display:none!important;
	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column {
        grid-template-columns: repeat(2, 1fr);
	} 
	.color-palette-section .color-palette-row .et_pb_column .color-palette-colors-column {
		display:flex;
		width:100%;
	}
	.color-palette-section .color-palette-row .et_pb_column .color-palette-colors-column  .et_pb_code_inner {
		width:100%!important;
	}
	.color-palette-section .color-palette-row .color-codes-container .color-code {
        width: 100% !important;
        height: 97px;
	}
	.color-palette-section .color-palette-row .color-codes-container {
		grid-template-columns:repeat(1, 1fr);
	}
	.color-palette-section .color-palette-row .color-codes-container .color-code .color-code-text-container {
		transform:unset!important;
		top:20px;
		left:18px;
	}
	.color-palette-section .color-palette-row {
		    padding: 43px 30px 60px 30px !important;
	}
	.color-palette-section .color-palette-row .et_pb_column {
        gap: 60px !important;
    } 
	.color-palette-section .color-palette-row .color-codes-container .color-code .color-tooltip {
		opacity:0!important;
		visibility:hidden!important;
		transition-delay:0.3s!important;
		right: 15px !important;
        top: 50%;
        transform: translateY(-50%);
	}
	.color-palette-section .color-palette-row .color-codes-container .color-code .color-tooltip::before {
		display:none!important;
	}
	.color-palette-section .color-palette-row .color-codes-container .color-code .color-tooltip.active {
/* 		display:none!important; */
		opacity:1!important;
		visibility:visible!important;
	}
	.planable-in-action-section {
    padding-block: 80px !important;
}
}

@media(max-width:500px) {
	#page-container #et-boc .hero-section p {
		max-width:279px;
		margin-inline:auto;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row {
        padding: 39px 35px 30px 31px !important;
	} 
	#page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column h2{
		font-size:39px!important;
		max-width: 217px;
		line-height:1.2!important;

	}
	#page-container #et-boc .color-palette-section .color-palette-row .color-palette-text-column h2 {
		font-size:39px!important;
		line-height:1.2!important;
	}
	#page-container #et-boc .color-palette-section .color-palette-row .color-palette-text-column h2 br {
		display:block!important;
		
	}
	#page-container .color-palette-section .color-palette-row .color-palette-text-column p {
		padding-bottom:1.5em!important;
		font-size:16px!important;
		max-width: 256px!important;
	}
	#page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item, #page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item:nth-of-type(1), #page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item:nth-of-type(2) {
		padding-bottom:1.5em!important;
		font-size:16px!important;
		max-width: 256px;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column {
		width:100%!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column a.plnb-button-primary {
		max-width:max-content;
		margin-inline:auto!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .et_pb_column {
		gap:56px;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card:first-of-type::before, .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card:nth-of-type(2)::before {
		display:none!important;
	}
	
	.wordmark-and-symbol-section .wordmark-and-symbol-row  .three-columns-title {
		display:none!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-cards-container {
		grid-template-columns:1fr!important;
		gap:10px;
		margin-bottom:10px!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-cards-container {
		grid-template-columns:1fr!important;
		gap:10px!important;
	}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-cards-container .small-card {
	border-radius: 13.991px!important;
		min-height:241px!important;
}
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-cards-container .big-card {
	border-radius: 13.991px!important;
}
	
	#page-container .what-to-avoid-section .what-to-avoid-title-row p.subtitle {
		max-width: 316px!important;
		font-size: 18px!important;
		margin-inline:auto!important;
		font-weight: 600!important;

	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column {
        grid-template-columns: unset;
grid-auto-flow: column;
  grid-auto-columns: auto;
    } 
	.what-to-avoid-section {
		padding-inline:0px!important;
	}
	.what-to-avoid-title-row {
		padding-right:var(padding-inline-section)!important;
	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column .card-container {
		height:180px!important;
		width:257px!important;
	}
	.what-to-avoid-section .what-to-avoid-cards-row  {
		overflow:hidden!important;
	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column {
		overflow-x:scroll!important;
		scrollbar-width: none!important;
		padding-inline:var(--padding-inline-section)!important;
	}
	.what-to-avoid-section .what-to-avoid-cards-row .et_pb_column::-webkit-scrollbar {
  display: none; 
}
	#page-container #et-boc .color-palette-section .color-palette-row .color-palette-text-column .plnb-button-primary {
		padding:30px 7px!important;
		font-size: 17px!important;
	}
	    .color-palette-section .color-palette-row {
        padding: 46px 22px 44px 22px !important;
	} 
	.color-palette-section .color-palette-row .color-codes-container {
		gap:44px!important;
	}
	.color-palette-section .color-palette-row .color-codes-container .color-code .color-code-text-container {
        transform: unset !important;
        top: 21px;
        left: 23px;
    }
	
	#page-container .planable-in-action-section h2 {
		font-size:39px!important;
		line-height:1.2!important;
		max-width: 192px;
    	margin-inline: auto;
	}
	#page-container .planable-in-action-row p {
		max-width: 286px !important;
    	margin-inline: auto;
	}
	#page-container .planable-in-action-section .plnb-button-primary, #page-container #et-boc .plnb-prefooter-section .plnb-button-primary {
		font-size:18px!important;
	}
	#page-container div.plnb-prefooter-section .prefooter-text-content {
	color: #FFF!important;
	text-align: center!important;
	font-family: Gilroy!important;
	font-size: 40px!important;
	font-style: normal!important;
	font-weight: 700!important;
	line-height: 110%!important; 
	max-width:200px!important;
}
#page-container .prefooter-text-description {
	color: #FFF!important;
	text-align: center!important;

	font-family: Gilroy!important;
	font-size: 16px!important;
	font-style: normal!important;
	font-weight: 500!important;
	line-height: 160%!important; 
	max-width:300px!important;
	margin-inline:auto!important;
}
	    .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .small-card a {
        opacity: 0 !important;
    }
	.hero-section a.plnb-button-primary {
		padding-inline:30px!important;
	}
	#page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item {
		        max-width: 256px !important;
	}
	    .color-palette-section .color-palette-row .color-codes-container .color-code .color-tooltip {
        right: 5px !important;
        top: unset;
        transform: unset;
        bottom: 5px;
        padding: 10px !important;
        font-size: 12px !important;
        max-width: max-content;
    }
}

@media(min-width:376px) and (max-width:500px) {
	#page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item, #page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item:nth-of-type(1), #page-container .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .description-item:nth-of-type(2) {
		max-width:100%!important;
	}
}

@media(max-width:375px) {
	#page-container div.plnb-prefooter-section a.plnb-button-primary {
		padding-inline:30px!important;
	}
	.hero-section a.plnb-button-primary {
		padding-inline:15px!important;
	}
}

@media (max-width: 320px) {
    #page-container #et-boc .plnb-prefooter-section .plnb-button-primary {
        padding: 30px 8px !important;
    }
	.wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-cards-column .big-card .logo {
		padding-inline:20px!important;
	}
	.hero-section a.plnb-button-primary {
		padding-inline:15px!important;
	}
	#page-container #et-boc .wordmark-and-symbol-section .wordmark-and-symbol-row .wordmark-and-symbol-text-column .plnb-button-primary {
		        padding: 30px 16px !important;
        font-size: 16px !important;
	}
	#page-container #et-boc .color-palette-section .color-palette-row .color-palette-text-column .plnb-button-primary {
		font-size:14px!important;
	}
}