/* 
Theme Name: wp-theme_kit
Author: Web Development Team of Planet Smart City 
Author URI: https://wordpress.org/
Description: A custom theme for Planet Smart City India.
Requires at least: 5.9
Tested up to: 5.9
Requires PHP: 5.6
Version: 1.1
Text Domain: wp-theme_kit
*/

:root {
    --dark: #09091E;
    --light: #3E4462;
    --white: #FFFFFF;
    --black: #000000;
    --primary: #309BDA;
    --secondary: #EAAF3E;
    --tertiary: #DF4853;
    --quatertiary: #7EC152;
    --quinary: #E8EDF3;
    --grey-dark: #EBEBEC;
    --grey-light: #F7F7F6;
}


/**
* general settings
**/

* {
    box-sizing: border-box;
    font-family: "Exo 2", sans-serif;
    -webkit-font-smoothing: antialiased;
    max-height: 999999px; /* Hack, see https://stackoverflow.com/questions/13430897/how-to-override-font-boosting-in-mobile-chrome */ 
    text-size-adjust: none;
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
    -moz-text-size-adjust: none;
}

blockquote,
figure {
    margin: 0;
}

body {
    color: var(--dark);
    margin: 0;
    padding: 0;
}

img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

ul li {
    list-style-type: none;
}

input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/** 
* # main
**/

main {
    margin-top: 80px;
}

@media only screen and (min-width: 768px) {

    main {
        margin-top: 100px;
    }
}

#keyword{
	border: none;
	border-radius: 5px;
	box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.25);
	font-size: 1.25rem;
	margin: auto;
	padding: 1rem;
	width: 100%;
}

#keyword:focus{
	outline: none;
}

#query-keyword{
	display: grid;
}

#datafetch{
	background-color: white;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.25);
	display: none;
	margin: auto;
	max-height: 400px;
	overflow-y: scroll;
	padding: 1rem;
	width: 100%;
}

#datafetch ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

#datafetch ul li{
	padding: .5rem;
}

.li__title{
	border-bottom: 1px solid var(--grey-dark);
	color: silver;
	font-size: .8rem;
	font-weight: bold;
	margin: .5rem 0 .25rem 0;
}

.li__excerpt{
	color: silver;
	font-size: .9rem;
}

#datafetch ul li a:any-link{
	color: black;
	text-decoration: none;
}


/**/

/* The Modal (background) */
.modal {
	backdrop-filter: blur(2px);
	background-color: rgba(0,0,0,0.25);
	display: none;
	position: fixed; 
	z-index: 99; 
	left: 0;
	top: 0;
	width: 100%; /* Full width */
	height: 100%; /* Full height */
  }
  
  /* Modal Content/Box */
  .modal-content {
	margin: 8% auto; /* 15% from the top and centered */
	max-width: 700px;
	overflow-y: initial;
  }

  .btn {
	background-color: var(--primary);
    border: none;
    border-radius: 5px;
    color: var(--white);
    cursor: pointer;
    float: right;
    font-size: .8rem;
    font-weight: bold;
    margin-left: auto;
    margin-right: 1rem;
    margin-top: 1.5rem;
    text-decoration: none;
    text-transform: uppercase;
    padding: .5rem;
    z-index: 3;
  }

  #myBtn svg{
    margin-right: .5rem;
	width: 12px;
  }

/** 
* # stack 
**/

.stack {
    background-color: var(--white);
	grid-column: span 3;
	padding: 40px 0 80px 0;
}

.stack--alt {
    background-color: var(--quinary);
}

.header:not(.header--cover)+.stack:not(.stack--alt) {
    padding-top: 0;
}

@media only screen and (min-width: 768px) {

    .stack {
        padding: 50px 0 100px 0;
    }
}

/**
* # heading block
**/

.heading {
    font-size: 38px;
    font-weight: 600;
    letter-spacing: -1.5px;
    line-height: 40px;
    margin: 0 auto;
    max-width: 734px;
    padding: 0 24px;
    text-align: center;
    width: 100%;
}

.heading+* {
    margin-top: 80px;
}

.heading+.accordion__wrapper {
    margin-top: calc(80px - 24px);
}

/* alternative heading */
.heading--alt {
    font-size: 30px;
    line-height: 34px;
    max-width: 734px;
    font-weight: 600;
    letter-spacing: -1.5px;
    text-align: left;
}

.heading--alt+* {
    margin-top: 40px;
}


.heading+.button {
    margin-top: 24px;
}

.heading--small {
    font-size: 1.75rem;
    font-weight: 600;
    letter-spacing: -1px;
    line-height: 2rem;
}





@media only screen and (min-width: 768px) {

    .heading,
    .heading--alt {
        font-size: 54px;
        line-height: 58px;
        padding: 0;
    }

    .heading--alt {
        text-align: center;
    }

    .heading+* {
        margin-top: 100px;
    }

    .heading--alt+* {
        margin-top: 60px;
    }

    .heading--small {
        font-size: 1.75rem;
        font-weight: 600;
        letter-spacing: -1px;
        line-height: 2rem;
    }
}


/**
* # tag element
**/

.tag-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 0;
    margin-top: 0.625rem;
}

.tag {
    background-color: var(--light);
    border-radius: 14px;
    color: var(--white);
    display: inline;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.2px;
    line-height: 20px;
    padding: 4px 16px;
    text-decoration: none;
    width: fit-content;
}

.tag--compact {
    background: transparent;
    border-radius: 0;
    color: var(--dark);
    padding: 0;
	text-decoration: underline;
    text-transform: uppercase;
}

.tag--compact:not(:last-child):after {
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' fill='%2318214d' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='50' cy='50' r='50'/%3E%3C/svg%3E");
    font-weight: 900;
    height: 3px;
    margin-bottom: 2px;
    margin-left: 3px;
    padding: 0px 1px;
    width: 4px;
    vertical-align: middle;
}

/** 
* # button
**/

.button,
.link {
    cursor: pointer;
    display: inline-block;
    font-size: 18px;
}



.button {
    background-color: var(--primary);
    border-radius: 8px;
    color: #ffffff;
    font-weight: 600;
    margin-top: 24px;
    min-width: 142px;
    /* padding: 12px 26.5px 16px 30.5px;  adjust font Exo margin*/
    padding: 13px 26.5px 15px 30.5px;
    text-align: center;
    text-decoration: none;
}


.button--inverse {
    background-color: #ffffff;
    color: var(--dark);
}

.button__append--download {
    background-color: currentColor;
    clip-path: padding-box inset(0.25em 0);
    content: '';
    margin-left: 10.5px;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M360 431.1H24c-13.25 0-24 10.76-24 24.02C0 469.2 10.75 480 24 480h336c13.25 0 24-10.76 24-24.02C384 442.7 373.3 431.1 360 431.1zM302.5 207.7L216 299.7v-243.6C216 42.76 205.3 32 192 32S168 42.76 168 56.02v243.6L81.47 207.7C76.75 202.6 70.38 200.1 64 200.1c-5.906 0-11.81 2.158-16.44 6.536c-9.656 9.069-10.12 24.27-1.031 33.93l128 136.1c9.062 9.694 25.88 9.694 34.94 0l128-136.1c9.094-9.663 8.625-24.86-1.031-33.93C326.8 197.5 311.6 197.1 302.5 207.7z'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M360 431.1H24c-13.25 0-24 10.76-24 24.02C0 469.2 10.75 480 24 480h336c13.25 0 24-10.76 24-24.02C384 442.7 373.3 431.1 360 431.1zM302.5 207.7L216 299.7v-243.6C216 42.76 205.3 32 192 32S168 42.76 168 56.02v243.6L81.47 207.7C76.75 202.6 70.38 200.1 64 200.1c-5.906 0-11.81 2.158-16.44 6.536c-9.656 9.069-10.12 24.27-1.031 33.93l128 136.1c9.062 9.694 25.88 9.694 34.94 0l128-136.1c9.094-9.663 8.625-24.86-1.031-33.93C326.8 197.5 311.6 197.1 302.5 207.7z'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-repeat: no-repeat;
    mask-position: center;
    padding: 0.1em 0.4em;
    vertical-align: middle;
}

.button--prefooter {
    margin-top: 32px;
}


/* iPad Mini in portrait & landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    .button__append--download {
        padding: 0.11em 0.52em !important;
    }

}

/**
* # archive
**/

.archive__header {
    grid-area: head-title;
}

.archive__title {
	color: var(--dark);
    display: block;
    font-size: 38px;
    font-weight: 600;
    letter-spacing: -1.4px;
    line-height: 37px;
    margin-top: 14px;
    margin-bottom: 48px;
}

.archive-list__above-header {
    display: block;
    grid-area: above;
    margin-bottom: 14px;
    margin-top: 22px;
    width: 100%;
}

.archive-list__title {
    color: var(--dark);
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.5px;
    line-height: 24px;
    text-decoration: none;
}

.archive-list__item {
    margin-bottom: 125px;
}

.archive-list__item {
    display: grid;
    grid-template-areas:
        "above above"
        "header aside"
        "footer footer";
    grid-template-columns: 1fr 90px;
    margin-bottom: 32px;
}

.archive-list__header {
    max-width: 248px;
}

.archive-list_item__aside {
    grid-area: aside;
    width: 100%;
}

.archive-list_item__aside figure img {
    aspect-ratio: 16/9;
    border-radius: 0.75rem;
    height: auto;
    margin-top: 0;
    max-width: 100%;
    object-fit: cover;
    object-position: top;
    width: 100%;
}

.archive-list__excerpt {
    display: none;
}

@media only screen and (min-width: 768px) {
    .archive-page {
        align-items: start;
        display: grid;
        grid-template-columns: 700px auto;
        grid-template-areas:
            "head-title"
            "articles";
        grid-column-gap: 2.813rem;
        justify-content: space-between;
        max-width: 1117px;
        margin: 0 auto;
        padding: 0 15px 0;
    }

    .archive-list__above-header {
        margin-top: 0;
    }

    .archive__title {
        display: block;
        font-size: 58px;
        font-weight: 600;
        letter-spacing: -1.4px;
        line-height: 62px;
        margin-top: 14px;
        margin-bottom: 100px;
    }

    .archive-list {
        grid-area: articles;
        grid-template-columns: 1fr;
        max-width: 700px;
    }

    .archive-list__title {
        font-size: 38px;
        line-height: 42px;
        letter-spacing: -1.4px;
    }

    .sidebar {
        grid-area: sidebar;
        margin-top: 0;
    }

    .archive-list__item {
        display: grid;
        grid-template-areas:
            "aside above"
            "aside header"
            "aside footer";
        grid-column-gap: 3rem;
        grid-template-columns: 190px auto;
    }

    .archive-list__header {
        max-width: 498px;
    }

    .archive-list__excerpt {
        display: block;
        font-size: 14px;
        letter-spacing: 0;
        line-height: 22px;
        margin-top: 14px;
    }
}


@media only screen and (max-width: 1180px) {
    .archive-page {
        display: grid;
        grid-template-areas:
            "head-title"
            "articles"
            "sidebar";
        grid-column-gap: 2.813rem;
        grid-template-columns: 1fr;
        justify-content: space-between;
        padding: 0 24px 0;
    }

    .sidebar {
        margin: 100px auto 0;
    }
}


/** 
* # card 
**/

.card--upside {
    /* don't use grid because weird behavior on safari iPhone 13 and cease to respect margin in .card-group+.heading
    align-items: end;
    display: grid; 
    */
    display: flex;
    place-items: flex-end;
}

.card-group {
    display: grid;
    grid-gap: 24px;
    grid-template-columns: auto;
    margin-left: auto;
    margin-right: auto;
    max-width: fit-content;
    padding-left: 24px;
    padding-right: 24px;
}

.card {
    aspect-ratio: 400/601;
    border-radius: 16px;
    /*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
    max-width: 400px;
    padding: 40px 32px;
    /* padding-right: 64px; legacy version */
    position: relative;
    width: 100%;
}

@supports not (aspect-ratio: 400/601) {
    .card {
        min-height: 601px;
    }
}

.card__headline {
    font-size: 28px;
    font-weight: 600;
    letter-spacing: -1px;
    line-height: 30px;
}

.card__headline--big {
    font-size: 40px;
    letter-spacing: -1px;
    line-height: 42px;
}

.card__copy {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -.5px;
    line-height: 22px;
}

.card__headline+.card__copy {
    margin-top: 16px;
}

.card__header,
.card__copy,
.card__cta {
    position: relative;
    z-index: 1;
    font-weight: 600;
}

.card__header+.card__body {
    margin-top: 32px;

}

.card__figure,
.slide__figure {
    bottom: 0;
    height: 100%;
    margin: 0;
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 0;
    border-radius: inherit;
}

.card__figure,
.card__figure>*,
.card__figure>*>*,
.slide__figure>*,
.slide__figure>*>* {
    border-radius: inherit;
}

.card__figure img {
    object-position: center;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    object-fit: cover;
}

.card--center,
.slide--center {
    text-align: center;
}

.card,
.slide {
    background-color: var(--white);
}

.card--inverse,
.slide--inverse {
    background-color: var(--light);
}

.card--primary,
.slide--primary {
    background-color: var(--primary);
}

.card--black,
.slide--black {
    background-color: var(--black);
}

.card--secondary,
.slide--secondary {
    background-color: var(--secondary);
}

.card--tertiary,
.slide--tertiary {
    background-color: var(--tertiary);
}

.card--quatertiary,
.slide--quatertiary {
    background-color: var(--quatertiary);
}

.card--quinary,
.slide--quinary {
    background-color: var(--quinary);
}

.card--inverse,
.slide--inverse,
.card--primary,
.slide--primary,
.card--secondary,
.slide--secondary,
.card--tertiary,
.slide--tertiary,
.card--quatertiary,
.slide--quatertiary,
.card--black,
.slide--black {
    color: #ffffff;
}

.card--prefooter {
    background-color: var(--light);
    aspect-ratio: 366/350;
    display: grid;
    align-items: center;
    text-align: center;
}

@supports not (aspect-ratio: 366/350) {
    .card--prefooter {
        min-height: 350px;
    }
}


.card__bullet {
    list-style-type: none;
    margin-bottom: 0;
    margin-top: 0;
    padding-left: 0;
}

.card__bullet li {
    background: url("data:image/svg+xml,%3Csvg width='18px' height='18px' viewBox='0 0 18 18' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-56.000000, -2069.000000)'%3E%3Cg transform='translate(56.000000, 2069.000000)'%3E%3Crect fill='%23FFFFFF' x='0' y='0' width='18' height='18' rx='9'%3E%3C/rect%3E%3Cg transform='translate(4.800000, 6.000000)' fill='%2318214D'%3E%3Cpath d='M8.22420894,0.176072325 C8.45859702,0.410460405 8.45859702,0.789231542 8.22420894,1.02361962 L3.42394107,5.82388749 C3.18955299,6.05827557 2.81078185,6.05827557 2.57639377,5.82388749 L0.175734807,3.42375356 C-0.0585782689,3.18936548 -0.0585782689,2.81059434 0.175734807,2.57620626 C0.410085384,2.34181818 0.789981584,2.34181818 1.02436966,2.57620626 L2.98329148,4.55069144 L7.37666164,0.176072325 C7.61104972,-0.0586907752 7.98982086,-0.0586907752 8.22420894,0.176072325 L8.22420894,0.176072325 Z'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-position-y: 3px;
    background-repeat: no-repeat;
    margin-bottom: 2rem;
    padding-left: 26px;
}

.card__bullet li:last-of-type {
    margin-bottom: 0;
}

.card-group+.tile-group {
    margin-top: 24px;
}

.card-group+.heading,
.swiper+.heading {
    margin-top: 80px;
}

@media only screen and (min-width: 768px) {

    .card--wide {
        aspect-ratio: 824/260;
        display: grid;
        grid-column: span 2;
        grid-template-columns: 1fr 1fr;
        /*50% of wide card minus right padding plus half grid gutter*/
        grid-template-rows: min-content;
        max-width: 824px;
        min-height: 260px;
        width: 100%;
    }

    .card--prefooter {
        aspect-ratio: 824/260;
        display: grid;
        grid-column: span 2;
        grid-template-columns: 1fr;
        max-width: 824px;
        min-height: 260px;
        margin-left: auto;
        width: 100%;
    }

    .card--wider {
        grid-template-columns: calc(60% - calc(40px + calc(24px / 2)));
    }

    .card-group+.heading,
    .swiper+.heading {
        margin-top: 100px;
    }

    .card-group {
        grid-template-columns: repeat(2, auto);
        padding: 0;
    }

}

/* link */

/** 
* # link
**/

.link {
    color: var(--primary);
    text-decoration: none;
}

.link--inline {
    text-decoration: underline;
}

.link--standalone::after,
.summary__link::after {
    background-color: currentColor;
    clip-path: padding-box inset(6px 0);
    content: '';
    margin-left: 8px;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='17px' height='21px' viewBox='0 0 17 6' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-814.000000, -2515.000000)' fill='%23309BDA' fill-rule='nonzero'%3E%3Cpath d='M830.68842,2520.70676 L826.438285,2524.70701 C826.022901,2525.09797 825.350516,2525.09735 824.935796,2524.70701 C824.520744,2524.31636 824.520744,2523.68351 824.935796,2523.29286 L827.374643,2521.00053 L815.062534,2521.00053 C814.475152,2521.00053 814,2520.55363 814,2519.97234 C814,2519.39106 814.475152,2519.00041 815.062534,2519.00041 L827.374643,2519.00041 L824.93812,2516.70714 C824.523068,2516.31649 824.523068,2515.68364 824.93812,2515.29299 C825.353172,2514.90234 826.025557,2514.90234 826.440609,2515.29299 L830.690744,2519.29324 C831.103472,2519.68482 831.103472,2520.31611 830.68842,2520.70676 Z' id='Path-Copy-6'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg width='17px' height='10px' viewBox='0 0 17 10' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg transform='translate(-814.000000, -2515.000000)' fill='%23309BDA' fill-rule='nonzero'%3E%3Cpath d='M830.68842,2520.70676 L826.438285,2524.70701 C826.022901,2525.09797 825.350516,2525.09735 824.935796,2524.70701 C824.520744,2524.31636 824.520744,2523.68351 824.935796,2523.29286 L827.374643,2521.00053 L815.062534,2521.00053 C814.475152,2521.00053 814,2520.55363 814,2519.97234 C814,2519.39106 814.475152,2519.00041 815.062534,2519.00041 L827.374643,2519.00041 L824.93812,2516.70714 C824.523068,2516.31649 824.523068,2515.68364 824.93812,2515.29299 C825.353172,2514.90234 826.025557,2514.90234 826.440609,2515.29299 L830.690744,2519.29324 C831.103472,2519.68482 831.103472,2520.31611 830.68842,2520.70676 Z' id='Path-Copy-6'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    padding: 0 8px;
}

.link--inherit {
    color: inherit;
}

.link--standalone {
    color: inherit;
    font-weight: 500;
    letter-spacing: -0.5px;
    margin-top: 16px;
    text-decoration: underline;
}



/* rererence: https://www.carbondesignsystem.com/components/link/usage/#standalone-link */

.link--stretched::after {
    background-color: rgba(0, 0, 0, 0);
    bottom: 0;
    content: '';
    left: 0;
    pointer-events: auto;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}



.card--quinary .link,
.card--inverse .link {
    color: var(--primary);
}


  /**
* # post page
**/

.above__header {
    margin-bottom: 14px;
}

.post {
    margin: 0 auto;
    max-width: 735px;
    padding: 0;
}

.post__header {
    padding: 0 24px;
}

.post__date {
    color: var(--dark);
    display: inline-block;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.25rem;
}

.tag + .post__date{
    margin-left: 10px;
}

.post__date:has(~ .tag):after {
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' fill='%2318214d' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='50' cy='50' r='50'/%3E%3C/svg%3E");
    font-weight: 900;
    height: 3px;
    margin-bottom: 2px;
    margin-left: 3px;
    padding: 0 1px;
    width: 4px;
    vertical-align: middle;
}

.post__header__title {
    color: var(--dark);
    font-size: 38px;
    font-weight: 600;
    letter-spacing: -1.4px;
    line-height: 36px;
    margin: 0;
    padding: 0;
    text-decoration: none;
}

.post__header__excerpt {
    color: var(--dark);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.3px;
    line-height: 24px;
	margin-bottom: 32px;
    margin-top: 24px;
}

.post__aside {
    margin: 64px auto 32px;
    max-width: 735px;
    padding: 0;
}

.post__aside figure {
    margin-left: auto;
    width: calc(100% - 24px);

}

.post__aside figure img {
    aspect-ratio: 16/9;
    border-radius: 12px 0 0 12px;
    height: auto;
    max-width: 100%;
    object-fit: cover;
    object-position: center;
}

.post__social ul li a svg {
    margin-right: 0.5rem;
    width: 24px;
}

.post__copy {
    display: block;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.3px;
    line-height: 26px;
    padding: 0 24px;
}

.post__copy a {
    color: var(--primary);
}

.post__copy h2 {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -1px;
    line-height: 24px;
    margin-bottom: 1rem;
}

.post__copy p+h2 {
    margin-top: 2rem;
}

.post-grid__item {
    display: grid;
    grid-template-areas:
        "above above"
        "header aside"
        "footer footer";
    grid-template-columns: 1fr 90px;
    margin-bottom: 32px;
}

.post-grid__item__aside {
    grid-area: aside;
    width: 100%;
}

.post-grid__item__aside figure {
    aspect-ratio: 16/9;
	background-color: var(--grey-dark);
	border-radius: 0.75rem;
    height: auto;
    margin-top: 0;
    max-width: 100%;
    object-position: center;
    width: 100%;
}

.post-grid__item__aside figure img {
    border-radius: inherit;
    object-fit: cover;
}

.post-grid__above {
    display: block;
    grid-area: above;
    margin-bottom: 14px;
    margin-top: 22px;
    width: 100%;
}

.post-grid__title {
    color: var(--dark);
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.5px;
    line-height: 24px;
    text-decoration: none;
}

.post-grid__wrapper {
    padding: 0 24px;
}

.hero-news .post-grid__footer {
    margin: 0;
}

.hero-news .post-grid .post-grid__item .post-grid__footer .post-grid__excerpt {
    display: block;
}

.post-grid__title {
    max-width: 251px;
}

/**
* # hero news
**/

.hero-news {
    padding: 0 24px 0;
}

.hero-news .post-grid__item {
    align-items: center;
    display: grid;
    grid-template-areas:
        "aside"
        "above"
        "header"
        "footer";
    grid-template-columns: 1fr;
}

.hero-news .post-grid__title {
    max-width: 100%;
    margin: 0;
}

.hero-news .post-grid__title {
    color: var(--dark);
    font-size: 38px;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: -1.4px;
    line-height: 36px;
}

.hero-news .post-grid_item__aside figure img {
    aspect-ratio: 16/9;
    border-radius: 0.75rem;
    height: auto;
    margin-top: 0;
    max-width: 100%;
    object-fit: cover;
    object-position: center;
    width: 100%;
}

@supports not (aspect-ratio: 16/9) {

    .hero-news .post-grid_item__aside figure img::before {
        float: left;
        padding-top: 56.25%;
        content: "";
    }

    .hero-news .post-grid_item__aside figure img::after {
        display: block;
        content: "";
        clear: both;
    }
}

.no-style:any-link{
    color: var(--dark);
    text-decoration: none;
}


@media only screen and (min-width: 768px) {


    .post__header {
        padding: 0;
    }

    .post__header__title {
        font-size: 58px;
        line-height: 58px;
    }

    .post__header__excerpt {
        font-size: 18px;
        letter-spacing: -0.3px;
        line-height: 26px;
    }

    .post__aside {
        margin: 64px auto 32px;
        max-width: 735px;
        padding: 0;
    }

    .post__aside figure {
        margin: 0;
        width: 100%;
    }

    .post__aside figure img {
        border-radius: 12px;
    }

    .post__social {
        margin: 0 auto 32px;
        max-width: 735px;
        padding: 0;
    }

    .post__copy {
        margin: 0 auto;
        max-width: 735px;
        padding: 0;
    }

    .post__copy h2 {
        font-size: 28px;
        letter-spacing: -1px;
        line-height: 32px;
        margin-bottom: 1rem;
    }

    .post-grid__wrapper {
        margin-right: auto;
        margin-left: auto;
        max-width: 1117px;
    }

    .post-grid {
        align-items: baseline;
        column-gap: 4.938rem;
        display: grid;
        grid-template-columns: calc((100% - 9.876rem) / 3) calc((100% - 9.876rem) / 3) calc((100% - 9.876rem) / 3);
        grid-auto-flow: row dense;
    }

    @supports not (align-items: baseline) {
        .post-grid {
            align-items: end;
        }
    }

    .post-grid__item {
        grid-template-areas:
            "aside"
            "above"
            "header"
            "footer";
        grid-template-columns: 1fr;
    }

    .post-grid__title {
        color: var(--dark);
        font-size: 28px;
        font-weight: 600;
        letter-spacing: -1px;
        line-height: 32px;
        text-decoration: none;
    }

    .post-grid__excerpt {
        display: block;
        font-size: 14px;
        letter-spacing: 0;
        line-height: 22px;
        margin-top: 14px;
    }

    .hero-news {
        max-width: 1117px;
        margin: 0 auto;
    }

    .hero-news .post-grid {
        column-gap: 3.063rem;
        display: grid;
        grid-template-columns: 1fr;
    }

    .hero-news .post-grid__item {
        align-items: center;
        display: grid;
        grid-template-areas:
            "above above"
            "header aside"
            "footer aside";
        grid-template-columns: 1fr;
    }

    .hero-news .post-grid_item__aside {
        grid-area: aside;
        max-width: 475px;
    }

    .hero-news .post-grid__title,
    .hero-news .post-grid__footer {
        max-width: 546px;
        margin: 0;
    }

    .hero-news .post-grid__excerpt {
        display: block;
        font-size: 16px;
        letter-spacing: -0.3px;
        line-height: 26px;
        margin-top: 14px;
    }

    .hero-news .post-grid__title {
        color: var(--dark);
        font-size: 58px;
        font-weight: 600;
        letter-spacing: -1.4px;
        line-height: 58px;
        text-decoration: none;
    }

}

.pagination{
	margin: 65px auto 0 auto;
	text-align: center;
}

.page-numbers {
	margin: 0 10px;
    color: var(--dark);
}

.page-numbers:any-link {
    text-decoration: underline;
}

.page-numbers.current {
    color: var(--primary);
	font-weight: bold;
}

/* brand logo */

.brand__image{
    padding: 1rem;
    width: 130px;
}

/* generic container */

.container{
    margin: auto;
    max-width: 1117px;
    width: 100%;
}

nav{
    background-color: white;
    /*box-shadow: 0px 5px 15px 2px rgba(0,0,0,0.15);*/
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2;
}


.link--kit{
    float: right;
    font-size: 1rem;
    padding-top: 0.75rem;
}

/* WPML */

.wpml-ls-flag{
    width: 50px;
}