.nerd--about--wrapper, .nerd--podcasts, .nerd--text {
margin-left: auto;
margin-right: auto;
width: 95%;
max-width: 1140px;
padding-left: 24px;
padding-right: 24px;
}
svg, img {
display: block;
max-width: 100%;
height: auto;
}
html, body {
width: 100%;
min-width: 100%;
max-width: 100%;
}
p {
font-size: clamp(16px, 13.143px + 0.571vw, 20px);
}
h2 {
display: flex;
flex-direction: column;
gap: 12px;
margin-bottom: 0;
}
h2:after {
content: "";
height: 0.35em;
width: 100px;
max-width: 100%;
background: var(--underlined-heading--color, #e06249);
}
.site-head {
--header-background-colour: #4c597c;
--header-text-colour: #fff;
}
.nerd--main {
display: flex;
flex-direction: column;
gap: clamp(48px, 13.714px + 6.857vw, 96px);
}
.hero__component {
--background-color: #4c597c;
--text-color: #fff;
--text-size: clamp(16px, 10.286px + 1.143vw, 24px);
--heading-color: #fff;
--desktop--image--padding: 60px 24px;
--mobile--image--padding: 0 48px 48px;
--mobile--gap: 0;
}
.hero__component h1 span {
font-weight: 400;
font-family: "Averta Std CY", sans-serif;
font-size: inherit;
}
.nerd--text > p:last-child {
margin-bottom: 0;
}
.nerd--podcasts > .nerd--podcasts--items {
margin-top: 24px;
}
.nerd--podcasts--items {
display: flex;
flex-direction: column;
gap: clamp(12px, 7.714px + 0.857vw, 18px);
padding-top: clamp(12px, 7.714px + 0.857vw, 18px);
}
.nerd--podcasts--item--button {
background: #4c597c;
color: #fff;
padding: 15px clamp(24px, 6.857px + 3.429vw, 48px);
font-weight: bold;
width: 100%;
text-align: left;
display: flex;
justify-content: space-between;
align-items: center;
}
.nerd--podcasts--item--button:after {
content: "";
flex-shrink: 0;
background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2 2'%3E%3Cpath d='M 0 0 L 2 1 L 0 2 L 0 0' fill='%23fff'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-size: 40%;
background-position: 58% 50%;
background-color: #e06249;
width: clamp(30px, 12.143px + 3.571vw, 55px);
height: clamp(30px, 12.143px + 3.571vw, 55px);
border-radius: 50%;
}
.nerd--podcasts--disclosure {
display: flex;
flex-direction: column;
}
.show-more-button--component {
align-self: flex-start;
order: 1;
margin-bottom: 0;
margin-top: 24px;
background: none;
border: 3px solid #e06249;
color: #e06249;
transition: all 0.5s ease;
padding: 6px 48px;
}
.show-more-button--component:before {
background: #e06249;
}
.show-more-button--component:hover {
color: #fff;
}
.show-more-button--component.active {
color: #fff;
}
.nerd--podcasts--item--embed {
max-height: 0;
opacity: 0;
overflow: hidden;
transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out;
}
[aria-expanded=true] + .nerd--podcasts--item--embed {
max-height: var(--panel-height, 1200px);
opacity: 1;
}
.nerd--podcasts--item--embed > div {
padding-top: 24px;
display: flex;
justify-content: center;
}
.nerd--podcasts--disclosure--content {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease-in-out;
}
.nerd--about {
background: #4c597c;
color: #fff;
padding-top: clamp(48px, 13.714px + 6.857vw, 96px);
}
.nerd--about > img:last-child {
margin-top: 24px;
}
.nerd--about--wrapper {
display: grid;
column-gap: 96px;
row-gap: 48px;
}
@media (min-width: 800px) {
.nerd--about--wrapper {
grid-template-columns: 0.45fr 0.55fr;
}
}
.nerd--about--text h2 {
margin-bottom: 48px;
}
.nerd--about--text p {
font-size: clamp(16px, 14.571px + 0.286vw, 18px);
}
.nerd--about--text > :last-child {
margin-bottom: 0;
}
.nerd--about--hosts {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
column-gap: 48px;
row-gap: 24px;
}
.nerd--about--hosts h3 {
font-size: clamp(18px, 16.571px + 0.286vw, 20px);
font-family: "Averta Std CY", sans-serif;
font-weight: bold;
margin-bottom: 0;
}
.nerd--about--hosts p {
margin-bottom: 0;
font-size: clamp(14px, 12.571px + 0.286vw, 16px);
margin-top: 6px;
}
.nerd--about--hosts--host {
display: flex;
flex-direction: column;
gap: 24px;
}
.nerd--about--hosts--host img {
order: -1;
}
.nerd--about--hosts--text {
display: flex;
justify-content: space-between;
gap: 12px;
}