/* ################################################################# FEELING ################################################################# */

/* ----- Fonts ----- */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap');

:root {--font1: "Plus Jakarta Sans", system-ui;} 
:root {--font2: "Source Serif 4", serif;} /* INSTEAD OF Sang Bleu Versailles */

:root {--fontsize-mini: 11px;}
:root {--fontsize-smallest: 12px;}
:root {--fontsize-smaller: 14px;}
:root {--fontsize-small: 16px;}
:root {--fontsize-post-body: 18px;}
:root {--fontsize-large: 20px;}
:root {--fontsize-larger: 24px;}
:root {--fontsize-largest: 26px;}
:root {--fontsize-grid-header-large: 28px;}
:root {--fontsize-header3: 24px;}
:root {--fontsize-header2: 36px;}
:root {--fontsize-header1: 48px;}

/* ----- Colors ----- */
:root {--color-grey-darker: rgb(84, 86, 88);} 
:root {--color-text: #0d0d0d;}
:root {--color-purple: #c83aa2;}
:root {--color-purple-blue: #4B4FAA;}
:root {--color-purple-light: #f1f2fe;}
:root {--color-pink-light: #fff6ed;}
:root {--color-salmon: #f9ede4;}
:root {--color-grey-light: #f2f2f2;} /* rgba(0,0,0,.05) */
:root {--color-grey: #d9d9d9;} /* rgba(0,0,0,.15) */
:root {--color-grey-dark: #595959;} /* rgba(0,0,0,.65) */
:root {--color-blue: #014ecb;}
:root {--color-orange: #e3ae1e;}

/* ----- Icons ----- */
.menu-icon .icon {background-image: url(/files/icon/menu_a.svg);}
.menu > .icon {background-image: url(/files/icon/close_a.svg);}
.freebie > .icon {background-image: url(/files/icon/close_a.svg);}
.search .icon {background-image: url(/files/icon/search_b_white.svg); width: 17px; height: 17px;}
.social .items .facebook .icon {background-image: url(/files/icon/facebook_2.svg);}
.social .items .x .icon {background-image: url(/files/icon/x_2.svg);}
.social .items .tiktok {display: none;}
.social .items .pinterest {display: none;}
.social .items .instagram {display: none;}
.social .items .linkedin  {display: none;}
.social .items .youtube {display: none;}
.social .items .rss {display:none;}
.social .items .mail {display: none;}
.menu .search .icon,

/* ----- Gap ----- */
:root {--gap: 25px;}
:root {--gap-section: 100px;}
:root {--gap80: 80px;}
:root {--gap70: 70px;}
:root {--gap60: 60px;}
:root {--gap50: 50px;}
:root {--gap45: 45px;}
:root {--gap40: 40px;}
:root {--gap35: 35px;}
:root {--gap30: 30px;}
:root {--gap20: 20px;}
:root {--gap15: 15px;}
:root {--gap10: 10px;}
:root {--gap5: 5px;}

/* ----- Site Width ----- */
:root {--width-site: 1240px;}
:root {--width-site2: 720px;}
:root {--width-post: 930px;}

.image.col img, 
.single-header .featured-image img, 
.article img, 
.site-categories-images img, 
div:not(.offer) > .logo img {
   display: block;
}

input, textarea {
   font-family: var(--font1);
}
input,
input::placeholder {
   color: var(--color-grey-dark);
}
input:focus {
   color: var(--color-text);
}

/* ################################################################# VARIOUS ################################################################# */
* {
    box-sizing: border-box;
}
body {
   font-family: var(--font1);
   color: var(--color-text);
   font-size: var(--fontsize-post-body);
   line-height: 1.75rem;
   -webkit-text-size-adjust: 100%;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}
h1 {
   font-family: var(--font2);
   font-size: var(--fontsize-header1);
   font-weight: 700;
   line-height: 3.25rem;
   margin: 0 0 var(--gap15);
}
h2 {
   font-family: var(--font2);
   font-weight: 600;
   font-size: var(--fontsize-header2);
   line-height: 2.75rem;
   margin: var(--gap45) 0 var(--gap15);
}
h3 {
   font-family: var(--font2);
   font-size: var(--fontsize-header3);
   line-height: 2rem;
   margin: var(--gap45) 0 var(--gap15);
}
.post a {
   color: var(--color-blue);
}
.post a:hover {
   text-decoration: none;
}

#menu .logo a,
header .logo a,
.page .mobile .logo a,
footer .logo {
   text-decoration: none;
   font-family: var(--font2);
   color: var(--color-purple);
   font-weight: 800;
}
footer .logo {
   color: white;
}
#menu .logo a > span,
header .logo a > span,
.page .mobile .logo a > span,
footer .logo a > span {
   display: flex;
   font-size: 3em;
   text-align: center;
   gap: var(--gap5);
   line-height: 1em;
}
footer .logo a {
   color: white;
   text-decoration: none;
}
#menu .logo a > span > span,
header .logo a > span > span,
.page .mobile .logo a > span > span,
footer .logo a > span > span {
   background-color: var(--color-orange);
   height: 40px;
   min-width: 40px;
   border-radius: 50%;
}
.mobile .logo {
   width: fit-content;
}

.article {
   margin: 0;
}

.home > .section,
.directory .content,
.lead .content,
.single article,
.page .content,
.archive .content,
footer .inner {
   width: 100%;
   max-width: var(--width-site);
   margin-right: auto;
   margin-left: auto;
   padding: 0 var(--gap15);
}
.page .content {
   max-width: var(--width-site2);
   margin-right: auto;
   margin-left: auto;
}

.home {
   padding: var(--gap50) 0;
}
.directory .content,
.lead .content,
.post article,
.partner article,
.best article,
.shop article,
.archive .content {
   padding: var(--gap50) var(--gap20);
}

/* CONTENT */
.lead .content, 
.single-body, 
.page .content {
   line-height: 1.75rem;
}
.single-body > *:not(blockquote):not(h2):not(h3):not(table):not(.related):not(.faq):not(.brands):not(.types),
.lead .content > *:not(.overview),
.page .content > *:not(blockquote):not(h1):not(h2):not(h3):not(table):not(.related):not(.faq) {
   margin-bottom: var(--gap15);
   margin-top: 0;
}

/* HEADER */
header {
   font-family: var(--font1);
   padding-top: var(--gap15);
}
header .inner {
   justify-content: center;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
}
header .site-categories {
   order: 4;
   display: flex;
   width: 100%;
   border-top: 1px solid var(--color-grey);
   border-bottom: 1px solid var(--color-grey);
   justify-content: center;
   margin-top: var(--gap15);
   padding: 0 var(--gap);
}
header .site-categories .element-title,
header .join .newsletter {
   display: none;
}
header .site-categories .griditem a {
   display: block;
   padding: var(--gap15) var(--gap10);
   font-weight: 600;
   font-size: var(--fontsize-small);
   text-transform: uppercase;
}
header .search {
   order: 1;
   margin-right: auto;
   margin-left: var(--gap20);
   background-color: var(--color-purple-blue);
   display: flex;
   align-items: center;
}
header .search input {
   height: 30px;
   line-height: 30px;
   font-size: var(--fontsize-small);
   padding: 0 var(--gap10);
}
.search .icon {
   margin: 0 var(--gap10);
}
header .logo {
   order: 2;
}
header .logo img {
   height: 30px;
}
header .join {
   order: 3;
   margin-left: auto;
   margin-right: var(--gap20);
   display: flex;
   gap: var(--gap20);
   align-items: center;
   /*font-weight: 600;*/
   font-size: var(--fontsize-smaller);
}
header .join .subscribe {
   background-color: var(--color-purple-blue);
   color: white;
   padding: 0 var(--gap10);
}
header .join .signin {
   order: 2;
}

/* FORSIDE */
.section .heading,
.related .heading h3,
.single-bottom h2 {
   width: 100%;
   font-size: var(--fontsize-post-body);
   font-weight: 800;
   line-height: 22px;
   padding: var(--gap10) 0;
   border-top: 2px solid var(--color-orange);
   /*color: var(--color-purple-blue);*/
   margin-top: var(--gap40);
}
.section .heading + .grid {
   margin-top: var(--gap10);
}

.section .wide {
   width: calc(77% - var(--gap) / 2);
}
.section .side {
   width: calc(23% - var(--gap) / 2);
}

.grid13 {
   grid-template-rows: auto;
}
.grid13 .griditem:nth-child(1),
.grid13 .griditem:nth-child(2),
.grid13 .griditem:nth-child(3),
.grid13 .griditem:nth-child(4) {
   grid-row: 1 / span 1;
   border-bottom: 1px solid var(--color-grey);
}
.grid13 .griditem a {
   color: var(--color-text);
}
.grid .griditem .text,
.side.right .griditem .text {
   flex-direction: row;
   flex-wrap: wrap;
   padding: var(--gap10) 0;
}
.grid13 .image img {
   height: 120px;
}
.grid:not(.gridimg2):not(.grid1) .title,
.side.right .title {
   font-weight: 600;
   line-height: 1.4;
   width: 100%;
}
.grid:not(.gridimg2):not(.grid1) .title {
   font-size: var(--fontsize-smaller);
}
.grid:not(.gridimg2):not(.grid1) .sub,
.side.right .sub {
   display: block;
   order: 2;
   font-size: var(--fontsize-smaller);
   line-height: 1.3;
   margin: var(--gap10) 0 var(--gap15);
   width: 100%;
}
.grid .time,
.grid .category,
.side.right .time,
.side.right .category,
.single-header .time,
.single-bottom .grid31 .category {
   display: block;
   order: 3;
   font-family: var(--font1);
   font-size: var(--fontsize-smallest);
   color: var(--color-grey-darker);
   line-height: 14px;
}
.grid .category,
.side.right .category {
   order: 4;
   padding-left: var(--gap5);
   margin-left: var(--gap5);
   position: relative;
}
.grid .category:before,
.side.right .category:before {
   content: "";
   position: absolute;
   background-color: var(--color-grey-darker);
   width: 1px;
   height: 15px;
   left: 0px;
}
.side.right .griditem.article:not(:first-child) .image {
   display: none;
}
.side.right .griditem.text {
   margin-top: var(--gap10);
}
.side.right .griditem.text .text {
   border: 0;
}

.gridimg2,
.grid1 {
   margin-top: 0;
}
.gridimg2 .griditem,
.grid1 .griditem {
   border-bottom: 1px solid var(--color-grey);
}
.gridimg2 .griditem a,
.grid1 .griditem a {
   display: flex;
   flex-direction: row-reverse;
   justify-content: space-between;
   align-items: center;
}
.gridimg2 .article .image,
.grid1 .article .image {
   width: 65%;
}
.gridimg2 .article .image img,
.grid1 .article .image img {
   height: 340px;
}
.gridimg2 .griditem .text,
.grid1 .griditem .text {
   width: 33%;
   border: 0;
}
.section1 .gridimg2 .griditem .category,
.section1 .gridimg2 .griditem .time {
   display: none;
}
.gridimg2 .title,
.grid1 .title {
   font-size: var(--fontsize-grid-header-large);
   font-weight: 600;
   line-height: 1.2;
   margin-top: var(--gap20);
   margin-bottom: var(--gap10)
}
.gridimg2 .intro,
.grid1 .intro {
   display: block;
   font-size: var(--fontsize-smaller);
   line-height: 1.4;
   margin-bottom: var(--gap20)
}

.section3 .inner,
.section5 .inner,
.section8 .inner {
   flex-wrap: wrap;
   row-gap: var(--gap10);
}

.grid7 .image img {
   height: 190px;
}

.section6 .inner {
   background-color: var(--color-purple-light);
   padding: 0 var(--gap15);
}
.archive .content .section6 .inner {
   background-color: transparent;
   padding: 0;
}

.grid31 {
   grid-template-columns: repeat(12, calc((100% - var(--gap20)* 11) / 12));
   grid-template-rows: auto;
   gap: var(--gap20);
}
.grid31 .griditem.article {
   grid-row: 1 / span 1;
}
.grid31 .griditem.article .image,
.grid31 .griditem.article .sub,
.grid31 .griditem .category,
.grid31 .griditem .time {
   display: none;
}
.grid31 .griditem .text {
   border: 0;
   flex-wrap: nowrap;
   gap: var(--gap10);
}
.grid31 .griditem .number {
   display: inline;
   color: var(--color-grey-dark);
   font-size: var(--fontsize-header2);
}

.link-block {
   background-color: var(--color-pink-light);
   padding: var(--gap);
   display: flex;
   flex-wrap: wrap;
   gap: var(--gap15);
   font-size: var(--fontsize-small);
   border-top: 2px solid var(--color-orange);
   border-bottom: 2px solid var(--color-orange);
}
.link-block > div {
   flex: 1 1 30%;
}

/* DIRECTORY */
.directory .overview .article .intro,
.directory .overview .article .sub,
.directory .overview .article .name {
   display: block;
}
.directory > .content {
   display: flex;
   flex-direction: column;
   align-items: center;
   padding-left: var(--gap15);
   padding-right: var(--gap15);
}
.directory .overview {
   gap: var(--gap);
}
.directory .overview .article {
   border-bottom: 1px solid var(--color-grey);
}
.directory .overview .article:nth-child(odd) {
    grid-column: 1 / span 2;
}
.directory .overview .article:nth-child(even) {
    grid-column: 3 / span 2;
}
.directory .overview .article > a {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: var(--gap);
}
.directory .overview .article > a .text {
   display: flex;
   flex-direction: column;
   justify-content: center;
   padding-right: var(--gap);
   padding-bottom: var(--gap15);
}
.directory .overview .article .sub {
   color: var(--color-purple);
   font-size: var(--fontsize-mini);
   font-weight: 600;
   text-transform: uppercase;
   order: 1;
   font-family: var(--font1);
   line-height: 1.2;
}
.directory .overview .article .title {
   order: 2;
   font-weight: 600;
   line-height: 1.2em;
   margin: var(--gap5) 0;
   font-size: var(--fontsize-larger);
   font-family: var(--font2);
}
.directory .intro {
   order: 3;
   margin-top: var(--gap-mini);
   line-height: 1.4em;
   margin-bottom: 0;
   font-size: var(--fontsize-smallest);
}
.directory .overview .article > a .image {
   height: 200px;
}

/* LEAD */
.lead .overview .offer .logo,
.lead .overview .offer .number,
.lead .offer .label,
.lead .overview .offer .description,
.lead .overview .offer .stars,
.lead .overview .offer .list,
.lead .offer .law,
.lead .detailed .offer .name,
.lead .detailed .offer .data3 {
   display: none;
}
.lead .overview {
   max-width: var(--width-site2);
   margin: var(--gap50) auto;
   box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
   border-radius: 10px;
}
.lead .offer {
   font-family: var(--font1);
}
.lead .overview .offer {
   height: auto;
   padding: var(--gap15);
   font-size: var(--fontsize-smaller);
   justify-content: space-between;
   flex-wrap: nowrap;
}
.lead .overview .offer:not(:last-child) {
   border-bottom: 1px solid var(--color-grey);
}
.lead .overview .offer .name {
   width: 16%;
   font-size: var(--fontsize-smaller);
   font-weight: 900;
   text-transform: uppercase;
   line-height: 1.1em;
}
.lead .overview .offer [class^="data"] {
   width: 21%;
   text-align: center;
}
.lead .overview .offer .cta {
   width: 21%;
   font-weight: 600;
   text-align: right;
   background-color: var(--color-purple-blue);
   color: white;
   padding: 0 var(--gap10);
   min-width: max-content;
}
.lead .detailed {
   margin: var(--gap50) auto;
   display: flex;
   flex-direction: column;
   gap: var(--gap);
   padding: var(--gap) var(--gap15);
}
.lead .detailed .offer {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
   gap: var(--gap);
   position: relative;
   box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
   padding: var(--gap) var(--gap);
   font-size: var(--fontsize-small);
}
.lead .detailed .offer .number {
   position: absolute;
   top: -10px;
   left: -10px;
   display: flex;
   align-items: center;
   justify-content: center;
   color: white;
   background-color: var(--color-orange);
   box-shadow: -3px 3px 0 0 black;
   width: 30px;
   height: 30px;
   border: 1px solid white;
   font-weight: 600;
}
.lead .detailed .offer .logo {
   width: 11%;
   order: 1;
}
.lead .detailed .offer .logo img {
   max-height: 50px;
}
.lead .detailed .offer .stars {
   order: 2;
   width: 15%;
   display: flex;
   align-items: center;
   justify-content: center;
}
.lead .detailed .offer [class^="data"] {
   order: 3;
   text-align: center;
   background-color: var(--color-purple-light);
   padding: var(--gap15);
   border: 1px solid var(--color-purple-blue);
}
.lead .detailed .offer .cta {
   order: 4;
   width: 20%;
   background-color: var(--color-purple-blue);
   color: white;
   padding: var(--gap5);
   font-weight: 600;
   cursor: pointer;
   text-align: center;
}
.lead .detailed .offer .list {
   order: 5;
   width: 25%;
}
.lead .detailed .offer .list ul {
   margin: 0;
   padding: 0;
   list-style-type: none;
}
.lead .detailed .offer .list ul li {
   margin-left: var(--gap20);
}
.lead .detailed .offer .list ul li:before {
   content: '✓';
   margin-right: 10px;
   background-color: transparent;
   height: auto;
   width: auto;
   left: calc(var(--gap20) * -1);
   font-weight: 500;
}
.lead .detailed .offer .description {
   order: 6;
   width: 70%;
   font-size: var(--fontsize-smaller);
}

/* ARTIKLER */
.post article,
.partner article,
.best article,
.shop article,
.page .content {
   display: flex;
   flex-direction: column;
   align-items: center;
}
.single-right,
.single-header .featured-image {
   display: none;
}
.single-above .featured-image,
.single-header .time,
.single-header .author {
   display: block;
}
.single-above {
   max-width: var(--width-post);
}
.single-header,
.single-body {
   max-width: var(--width-site2);
}
.single-header .author {
   margin-top: var(--gap20);
   font-weight: 700;
   font-family: var(--font1);
}
.single-above {
   padding: var(--gap20) 0 var(--gap30);
}
blockquote {
   margin: var(--gap50) 0;
   padding-left: var(--gap15);
   border-left: 4px solid var(--color-purple);
}
.highlighted {
   padding: var(--gap20);
   border: 1px solid var(--color-purple);
}
table {
   border-collapse: collapse;
   border: 1px solid var(--color-orange);
   margin-bottom: var(--gap);
}
table th {
   text-align: left;
}
table th,
table td {
   padding: var(--gap5) var(--gap10);
}
table tr:nth-child(odd) {
   background-color: var(--color-pink-light);
}
table tr:first-child {
   background-color: var(--color-orange);
   color: white;
}
table td {
   font-size: var(--fontsize-small);
}
ol {
   counter-reset: section;
}
ul li,
ol li {
   list-style: none;
   position: relative;
   margin-left: var(--gap15);
   margin-bottom: var(--gap15);
}
ol li {
   margin-left: var(--gap20);
}
ul li:before,
ol li:before {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
}
ul li:before {
   content: "";
   display: block;
   background-color: var(--color-purple);
   height: 5px;
   width: 5px;
   border-radius: 50%;
   left: calc(var(--gap15) * -1);
}
ol li:before {
   counter-increment: section;
   content: counter(section) ". ";
   font-weight: 700;
   left: calc(var(--gap20) * -1);
}
.single-body .related {
   margin-bottom: var(--gap30);
}
.related h3 {
   margin-bottom: 0;
}
.related .article {
   padding: var(--gap5) 0;
}
.related .article .image {
   display: none;
}
.related .article a {
   text-decoration: underline;
}
.related .article a:hover {
   text-decoration: none;
}
.faq,
.consider,
.types,
.brands {
   padding: var(--gap20);
   border: 1px solid var(--color-purple);
   margin-bottom: var(--gap);
}
.faq h2,
.consider h2,
.types h2,
.brands h2 {
   margin-top: 0;
   font-weight: 700;
}
.faq h3,
.consider h3,
.types h3,
.brands h3 {
   font-family: var(--font1);
   font-size: var(--fontsize-large);
   margin: var(--gap15) 0 0;
}
.faq h3 + p,
.consider h3 + p,
.types h3 + p,
.brands h3 + p {
   margin-top: 0;
}
.faq p:last-child,
.consider p:last-child,
.types p:last-child,
.brands p:last-child {
   margin-bottom: 0;
}
.single-footer {
   margin-top: var(--gap50);
   max-width: var(--width-site2);
   width: 100%;
}
.single-footer .categories {
   display: flex;
   gap: var(--gap10);
}
.single-footer .categories .cat {
   background-color: var(--color-salmon);
   font-family: var(--font1);
   font-size: var(--fontsize-smaller);
   padding: var(--gap10);
}
.single-bottom .section6 {
   padding: 0 var(--gap15);
}
.single-bottom h2 {
   padding-bottom: 0;
}
.single-bottom .grid31 .category {
   display: block;
   margin: 0;
   padding: 0;
   font-weight: 400;
}
.single-bottom .grid31 .text {
   flex-direction: column;
}
.single-bottom .grid31 .category:before,
.single-bottom .grid31 .number {
   display: none;
}
.page .content {
   align-items: flex-start;
}
.page .content h1 {
   margin-bottom: var(--gap20);
}

/* BEST */
.best .overview,
.best .others {
   display: flex;
   flex-direction: column;
   font-family: var(--font2);
}
.best .overview h2,
.best .detailed h2,
.best .others h2 {
   padding-top: var(--gap10);
}
.best .overview .product,
.best .others .product {
   margin-bottom: var(--gap20);
   line-height: 1.3em;
   font-family: var(--font1);
}
.best .overview .product .label,
.best .overview .product .jump,
.best .others .product .label,
.best .others .product .cta {
   display: block;
}
.best .overview .product .label,
.best .others .product .label {
   font-size: var(--fontsize-smaller);
}
.best .others .product .label {
   color: var(--color-purple);
}
.best .overview .product .title,
.best .others .product .title {
   font-size: var(--fontsize-post-body);
   font-weight: 400;
}
.best .overview .product .title a {
   color: var(--color-purple-blue);
   font-weight: 700;
}
.best .others .product .title a {
   font-weight: 700;
}
.best .overview .product .jump {
   font-size: var(--fontsize-smallest);
   cursor: pointer;
}
.best .overview .product .jump:before {
   content: "\2193";
   padding-right: 3px;
}
.best .others .product .cta {
   padding-top: 2px;
   font-family: var(--font1);
   font-weight: 600; 
}
.best .others .product .cta a {
   background-color: var(--color-purple-blue);
   color: white;
   display: inline-block;
   padding: 0px 5px;
   font-size: var(--fontsize-smallest);
   text-transform: uppercase;
}
.best .detailed,
.best .detailed .product {
   display: flex;
   flex-direction: column;
   font-family: var(--font2);
}
.best .detailed .product .title {
   font-weight: 600;
   font-size: var(--fontsize-header3);
}
.best .detailed .product {
   padding: var(--gap50) 0;
   font-family: var(--font1);
}
.best .detailed .product::not(:last-child) {
   border-bottom: 1px solid var(--color-grey-dark);
}
.best .detailed .product h3 {
   font-family: var(--font2);
   font-size: var(--fontsize-post-body);
}
.best .detailed .product .label,
.best .detailed .product .image,
.best .detailed .product .price,
.best .detailed .product .cta,
.best .detailed .product .rating2,
.best .detailed .product .rating3,
.best .detailed .product .pros-cons-2-lists,
.best .detailed .product .description,
.best .detailed .product .specifications {
   display: block;
}
.best .detailed .product .label {
   order: 0;
}
.best .detailed .product .image {
   order: 2;
}
.best .detailed .product .price {
   order: 3;
   color: var(--color-purple);
}
.best .detailed .product .cta {
   order: 4;
}
.best .detailed .product .rating2 {
   order: 5;
}
.best .detailed .product .rating3 {
   order: 6;
}
.best .detailed .product .pros-cons-2-lists {
   order: 7;
}
.best .detailed .product .description {
   order: 8;
}
.best .detailed .product .specifications {
   order: 9;
}
.best .detailed .product .label,
.best .detailed .product div.title,
.best .detailed .product .image,
.best .detailed .product .price,
.best .detailed .product .cta,
.best .detailed .product .rating2,
.best .detailed .product .rating3 {
   width: 100%;
   text-align: center;
}
.best .detailed .product .label {
   font-size: var(--fontsize-small);
   margin-bottom: var(--gap10);
}
.best .detailed .product .label span {
   background-color: var(--color-purple);
   color: white;
   font-weight: 500;
   font-size: var(--fontsize-small);
   border-radius: 10px;
   padding: var(--gap5) var(--gap15);
}
.best .detailed .product .price .amount,
.best .detailed .product .price .currency,
.best .detailed .product .rating3 .score {
   font-weight: 600;
}
.best .detailed .product div.title,
.best .detailed .product .cta {
   margin-bottom: var(--gap);
}
.best .detailed .product .cta {
   margin-top: var(--gap5);
   font-family: var(--font1);
   font-weight: 600; 
}
.best .detailed .product .cta a {
   background-color: var(--color-purple-blue);
   font-size: var(--fontsize-smaller);
   text-transform: uppercase;
   color: white;
   display: inline-block;
   padding: 5px var(--gap);
}
.best .detailed .product .pros-cons-2-lists {
   background-color: var(--color-grey-light);
   padding: var(--gap);
   margin-top: 1em;
}
.best .detailed .product .pros-cons-2-lists > h3,
.best .detailed .product .pros-cons-2-lists .pros-cons ul,
.best .detailed .product .specifications ul {
   margin-top: 0px;
}
.best .detailed .product .pros-cons-2-lists .pros-cons h3 {
   margin-top: var(--gap20);
   margin-bottom: 0px;
}
.best .detailed .product .pros-cons-2-lists .pros-cons ul,
.best .detailed .product .specifications ul{
   margin-bottom: 0px;
}
.best .detailed .product .pros-cons-2-lists .pros-cons ul {
   padding-left: var(--gap10);
   list-style-position: inside;
   font-size: var(--fontsize-smaller);
}
.best .detailed .product .pros-cons-2-lists li {
   margin-bottom: var(--gap5);
}
.best .detailed .product .specifications ul li:last-child {
   margin-bottom: 0;
}
.best .detailed .product:not(:last-child) {
    border-bottom: 1px solid var(--color-grey-light);
}

/* SHOP */
.shop .overview {
   display: flex;
   flex-wrap: wrap;
   gap: var(--gap20);
}
.shop .overview .product {
   font-family: var(--font2);
   flex: 1 1 calc(50% - var(--gap20) / 2 - 2px);
   max-width: calc(50% - var(--gap20) / 2 - 2px);
   padding: var(--gap20);
   display: flex;
   flex-direction: column;
   gap: var(--gap5);
   align-items: center;
   font-family: var(--font1);
}
.shop .overview .product .image {
   order: 1;
   text-align: center;
   width: 100%;
   background-color: var(--color-white);
   padding: var(--gap10) 0;
}
.shop .overview .product .image img {
   height: 200px;
}
.shop .overview .product .label {
   display: block;
   order: 2;
   text-align: center;
   font-weight: 600;
   line-height: 1.2em;
   font-size: var(--fontsize-small);
   padding: var(--gap5) 0;
}
.shop .overview .product .rating2 {
   display: block;
   order: 3;
   text-align: center;
}
.shop .overview .product .title {
   order: 4;
   text-align: center;
   font-size: var(--fontsize-larger);
   overflow: hidden;
   padding: var(--gap5) 0;
   font-family: var(--font2);
   font-weight: 700;
}
.shop .overview .product .summary {
   display: block;
   order: 4;
   text-align: center;
   font-size: var(--fontsize-smaller);
   line-height: 1.2em;
}
.shop .overview .product .jump {
   display: block;
   order: 5;
   text-align: center;
   font-size: var(--fontsize-smaller);
   margin-top: auto;
   text-decoration: underline;
   font-weight: 600;
}
.shop .overview .product .price {
   display: block;
   order: 6;
}
.shop .overview .product .cta {
   display: block;
   order: 7;
   background-color: var(--color-purple-blue);
   padding: var(--gap5) var(--gap15);
   text-transform: uppercase;
   letter-spacing: 0.083em;
   font-size: var(--fontsize-smallest);
   font-weight: 700;
}
.shop .overview .product .cta a {
   color: white;
}

/* FOOTER */
footer {
   border-top: 1px solid var(--color-grey);
   background-color: var(--color-grey-light);
   padding: var(--gap20) 0;
}
footer .inner {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}
footer [class^="list"] {
   width: 20%;
}
footer [class^="list"] .element-title {
   display: none;
}
footer [class^="list"] a {
   color: var(--color-text);
   font-weight: 600;
   text-decoration: none;
   padding: var(--gap5) 0;
   display: block;
   font-size: var(--fontsize-smaller);
   text-transform: uppercase;
}
footer .copyright {
   order: 5;
   border-top: 1px solid var(--color-grey);
   font-size: var(--fontsize-smaller);
   width: 100%;
   margin-top: var(--gap20);
   padding-top: var(--gap15);
}
footer .copyright .short,
footer .copyright .long {
   display: none;
}

/* ----- COOKIES ----- */
#cookies-overlay, #cookies {
   /*display: block !important;*/
}
#cookies-overlay {
   background-color: transparent;
   top: 0;
   bottom: 0px;
   left: 0px;
   right: 0px;
}
#cookies { 
   background-color: var(--color-purple-light); 
   padding: var(--gap20);
   top: auto;
   left: 0px;
   right: 0px;
   bottom: 0px;
   font-family: var(--font1);
   font-size: var(--fontsize-small);
}
#cookies .icon {
   display: none;
}
#cookies .text {
   flex-direction: row;
   justify-content: center;
   gap: var(--gap10);
   align-items: center;
   line-height: 1.4em;
   max-width: var(--width-site);
   margin: 0 auto;
}
#cookies .long1,
#cookies .short {
   display: block;
}
#cookies .short {
   font-size: var(--fontsize-post-body);
   line-height: 1.2em;
   font-weight: 700;
}
#cookies .long1 {
   color: var(--color-grey-dark);
   font-size: var(--fontsize-smallest);
   line-height: 1.4;
}
#cookies .deny {
   order: 2;
}
#cookies .settings {
   order: 3;
}
#cookies .accept,
#cookies .settings,
#cookies .deny {
   background-color: black;
   padding: var(--gap5) var(--gap10);
   font-weight: 600;
   width: 150px;
   text-align: center;
   cursor: pointer;
   color: white;
   min-width: max-content;
}

@media (max-width: 1200px) {
   .section .inner {
      flex-direction: row;
   }
   
   .gridimg2 .title {
      margin-top: 0;
   }
   .gridimg2 .griditem .text {
      padding: 0;
   }
   .gridimg2 .griditem a {
      align-items: unset;
   }
   
   .directory .overview .article > a {
      display: flex;
      flex-direction: column;
   }
   
   .section1 .inner {
      flex-direction: column;
   }
   
   .section .wide,
   .side.right {
      width: 100%;
   }
}
@media (max-width: 1000px) {
   .gridimg1 .griditem, .gridimg2 .griditem, .gridimg3 .griditem, .gridimg4 .griditem, .grid1 .griditem, .grid2 .griditem, .grid3 .griditem, .grid4 .griditem, .grid5 .griditem, .grid6 .griditem, .grid7 .griditem, .grid18 .griditem {
      height: auto;
   }
   
   .single-body > table,
   .page .content > table {
      max-width: 100%;
      overflow-x: auto;
      display: block;
   }
   
   .grid13 .griditem:nth-child(3), .grid13 .griditem:nth-child(4) {
      grid-row: 2 / span 1;
   }
   
   .gridimg2 .griditem a,
   .grid1 .griditem a{
      flex-direction: column;
   }
   .grid1 .griditem .image,
   .grid1 .griditem .text,
   .gridimg2 .article .image,
   .gridimg2 .article .text {
      width: 100%;
   }
   
   .grid31 .griditem:nth-child(4),
   .grid31 .griditem:nth-child(5),
   .grid31 .griditem:nth-child(6) {
      grid-row: 2 / span 1;
   }
   
   .lead .detailed .offer {
      justify-content: center;
   }
   .lead .detailed .offer .list,
   .lead .detailed .offer .cta {
      width: fit-content;
   }
   .lead .detailed .offer .list ul {
      display: flex;
   }
   .gridimg2 .title {
      margin-top: var(--gap20);
   }
}
@media (max-width: 767px) {
   header .site-categories .items {
      flex-wrap: wrap;
   }
}
@media (max-width: 600px) {
   .link-block {
      padding-top: 4%;
   }
   .link-block > div {
      width: 100%;
      margin-bottom: 4%;
   }
   
   .directory .overview {
      grid-template-columns: 1fr;
   }
   .directory .overview .article:nth-child(odd),
   .directory .overview .article:nth-child(even) {
      grid-column: 1 / span 1;
   }
   
   .lead .overview .offer {
      display: flex;
      flex-direction: column;
      align-items: center;
   }
   .lead .overview .offer .name,
   .lead .overview .offer [class^="data"],
   .lead .overview .offer .cta {
      width: fit-content;
   }
   .lead .detailed .offer,
   .lead .detailed .offer .list ul {
      flex-direction: column;
   }
   .lead .detailed .offer .description {
      width: 100%;   
   }
   .shop .overview .product {
      flex-basis: 100%;
      max-width: 100%;
   }
}