/**
 * Theme Name:     RadioLance Polska
 * Author:         Alla K.
 * Template:       generatepress
 * Text Domain:	   RadioLance Polska
 * Description:    GeneratePress is a lightweight WordPress theme built with a focus on speed and usability. Performance is important to us, which is why a fresh GeneratePress install adds less than 10kb (gzipped) to your page size. We take full advantage of the block editor (Gutenberg), which gives you more control over creating your content. If you use page builders, GeneratePress is the right theme for you. It is completely compatible with all major page builders, including Beaver Builder and Elementor. Thanks to our emphasis on WordPress coding standards, we can boast full compatibility with all well-coded plugins, including WooCommerce. GeneratePress is fully responsive, uses valid HTML/CSS, and is translated into over 25 languages by our amazing community of users. A few of our many features include 60+ color controls, powerful dynamic typography, 5 navigation locations, 5 sidebar layouts, dropdown menus (click or hover), and 9 widget areas. Learn more and check out our powerful premium version at https://generatepress.com
 */


@import url("../generatepress/style.css");

:root {
    --navy-900: #0D1B23;
    --navy-800: #122F49;
    --navy-700: #0D3E4F;
    --teal-700: #027279;
    --teal-600: #04898F;
    --teal-500: #26667B;
    --cyan: #52EEF8;
    --tint-a: #E8F9FA;
    --tint-b: #EDFAFC;
    --offwhite: #FBFDFD;
    --white: #FFF;
    --ink: #0D1B23;
    --muted: #54636B;
    --line: #DCEEF0;
    --radius: 18px;
    --shadow: 0 10px 35px rgba(13,62,79,.07);
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: var(--white);
    color: var(--ink);
    font: 16px/1.65 Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

a {
    color: inherit;
    text-decoration: none;
}

h1,h2,h3,p {
    margin-top: 0;
}

h1,h2,h3 {
    color: var(--navy-900);
    line-height: 1.13;
}

h1 {
    font-size: clamp(42px,5vw,68px);
    letter-spacing: -.045em;
    margin-bottom: 24px;
}

h2 {
    font-size: clamp(30px,3.4vw,46px);
    letter-spacing: -.035em;
    margin-bottom: 18px;
}

h3 {
    font-size: 18px;
    margin-bottom: 10px;
}

.rl-container {
    width: min(1180px,calc(100% - 48px));
    margin: auto;
}

.rl-section {
    padding: 92px 0;
}

.rl-section--tint {
    background: linear-gradient(135deg,var(--offwhite),var(--tint-b));
}

.rl-section--line {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.rl-eyebrow {
    margin-bottom: 14px;
    color: var(--teal-700);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.rl-eyebrow-on-dark {
    color: var(--cyan)!important;
	margin-bottom: 14px;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.rl-lead {
    font-size: 20px;
    max-width: 680px;
    color: var(--navy-700)
}

.rl-lead-sm {
    font-size: 20px;
    color: var(--navy-700);
}

.rl-intro {
    max-width: 760px;
    color: var(--muted);
    margin-bottom: 36px;
}

.rl-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    border: 0;
    border-radius: 999px;
    background: var(--teal-700);
    color: white;
    padding: 15px 24px;
    font-weight: 750;
    cursor: pointer;
    box-shadow: 0 7px 20px rgba(2,114,121,.15)
}

.rl-btn:hover {
    background: var(--cyan);
	color: var(--contrast);
}

.rl-btn--small {
    padding: 11px 18px;
    font-size: 14px
}

.rl-header {
    position: sticky;
    top: 0;
    z-index: 20;
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(220,238,240,.8)
}

.rl-header__row {
    height: 74px;
    display: flex;
    align-items: center;
    gap: 38px
}

.rl-logo {
    font-size: 23px;
    font-weight: 850;
    color: var(--navy-800);
    line-height: .85
}

.rl-logo span {
    color: var(--teal-600)
}

.rl-logo small {
    display: block;
    font-size: 8px;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--muted);
    margin-top: 6px
}

.rl-nav {
    display: flex;
    gap: 28px;
    margin-left: auto;
    font-size: 14px;
    font-weight: 650
}

.rl-nav a:hover {
    color: var(--teal-700)
}

.rl-hero {
    padding: 64px 0 54px;
    background: linear-gradient(110deg,#f6fcfd 0%,#e7f7fa 55%,#d8f1f4 100%)
}

.rl-hero__grid {
    display: grid;
    grid-template-columns: 1.02fr .98fr;
    align-items: center;
    gap: 60px
}

.rl-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 32px;
    font-size: 14px;
    font-weight: 650;
    color: var(--navy-700)
}

.rl-scan {
    border-radius: 28px;
    place-items: center;
    box-shadow: var(--shadow);
	margin-top: 24px;
}


.rl-hero-note {
	position: absolute;
	bottom: 32px;
	right: 92px;
    background: white;
    border-radius: 14px;
    padding: 16px 18px;
    font-size: 14px;
    box-shadow: var(--shadow);
	z-index: 1000;
}

.rl-heading-row {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 70px;
    align-items: end;
    margin-bottom: 36px
}

.rl-heading-row>p {
    color: var(--muted);
    max-width: 440px
}

.rl-grid {
    display: grid;
    gap: 18px
}

.rl-grid--5 {
    grid-template-columns: repeat(5,1fr)
}

.rl-grid--4 {
    grid-template-columns: repeat(4,1fr)
}

.rl-grid--2 {
    grid-template-columns: repeat(2,1fr)
}

.rl-card {
    padding: 22px 16px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: white;
    box-shadow: var(--shadow)
}

.rl-card p {
    font-size: 13px;
    color: var(--muted);
    margin: 0
}

.rl-card h3 {
    font-size: 17px;
    color: var(--navy-700);
    margin-top: 18px;
	font-weight: 600;
}

.rl-feature {
    display: grid;
    grid-template-columns: .95fr 1.05fr;
    gap: 90px;
    align-items: center
}

.rl-feature>div:first-child p {
    color: var(--muted);
    margin-bottom: 26px
}

.rl-benefits>div {
    padding: 20px;
}

.rl-benefits p {
    font-size: 14px;
    color: var(--navy-700);
}

.rl-benefits h3 {
    font-size: 17px;
    color: var(--navy-700);
    margin-top: 18px;
	font-weight: 600;
}

.rl-anatomy {
    margin-top: 30px
}

.rl-anatomy p {
    font-size: 17px;
    margin-top: 18px;
	font-weight: 600;
}

.rl-tile {
    min-height: 160px;
    padding: 22px;
    background: linear-gradient(145deg,var(--offwhite),var(--tint-a));
    border: 1px solid var(--line);
    border-radius: var(--radius);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.rl-tile:hover {
    background: var(--navy-800);
	color: var(--white);
}

.rl-tile b {
    font-size: 15px
}

.rl-steps {
   margin-top: 30px;
}

.rl-step__top {
    display: flex;
    align-items: center;
    width: 100%;
    margin-bottom: 12px;
}

.rl-step__number {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin: 0 0 14px;
    border-radius: 50%;
    background: var(--tint-a);
    color: var(--teal-700);
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
}

.rl-step__number::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 54px;
    width: 280px;
    height: 1px;
    background: var(--line);
    transform: translateY(-50%);
}

.rl-step__title {
    margin: 0 0 14px;
    color: var(--navy-900);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.25;
}

.rl-step__text {
    margin: 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.5;
}


/* Tablet */

@media (max-width: 900px) {

    .rl-steps {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .rl-step__text {
        max-width: 650px;
    }

}


/* Mobile */

@media (max-width: 600px) {

    .rl-steps {
        gap: 32px;
    }

    .rl-step__number {
        flex-basis: 44px;
        width: 44px;
        height: 44px;
        font-size: 20px;
    }

    .rl-step__title {
        margin-bottom: 10px;
        font-size: 19px;
    }

    .rl-step__text {
        font-size: 16px;
        line-height: 1.55;
    }

}

.rl-second {
    background: var(--navy-800);
    color: white
}

.rl-second h2,.rl-second .rl-lead-sm {
    color: white;
}

.rl-second p {
    color: #d9e8ed;
}

.rl-split {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 70px;
    align-items: center;
}


.rl-about {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 90px;
    align-items: center;
}

.rl-about>div>p {
    color: var(--muted)
}

.rl-quote {
    padding: 34px;
    background: var(--tint-a);
    border-radius: var(--radius);
}

.rl-quote p {
    margin: 10px 0 0;
    color: #26667B;
}

.rl-doctor-card {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
}

.rl-doctor-card__body {
    padding: 24px;
}

.rl-doctor-card h3 {
    font-size: 20px;
    line-height: 1.25;
    color: var(--navy-900);
}

.rl-doctor-card__specialty {
    margin: 0 0 6px;
    color: var(--teal-700);
    font-weight: 600;
}

.rl-doctor-card__experience {
    margin: 0;
    color: var(--muted);
}
.rl-avatar {
    height: 160px;
    display: grid;
    place-items: center;
    background: linear-gradient(160deg,#eaf6f7,#d5ecef);
    font-size: 34px;
    font-weight: 800;
    color: var(--teal-500)
}

.rl-doctors h3,.rl-doctors p {
    margin-left: 18px;
    margin-right: 18px
}

.rl-doctors h3 {
    font-size: 15px;
    margin-top: 17px
}

.rl-doctors p {
    font-size: 13px;
    color: var(--teal-700)
}

.rl-doctors p span {
    color: var(--muted)
}

.rl-cta {
    padding: 65px 0;
    background: linear-gradient(115deg,var(--teal-700),var(--navy-700));
    color: white
}

.rl-cta h2,.rl-cta .rl-eyebrow {
    color: white
}

.rl-cta h2 {
    margin-bottom: 8px
}

.rl-cta p {
    margin: 0;
    color: #dff7f8
}

.rl-cta__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px
}

.rl-btn--light {
    background: white;
    color: var(--teal-700);
    box-shadow: none;
    white-space: nowrap
}

.rl-faq-layout {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 80px
}

.rl-faq details {
    border-bottom: 1px solid var(--line);
    padding: 17px 0
}

.rl-faq summary {
    font-weight: 750;
    cursor: pointer;
    list-style: none;
    display: flex;
    justify-content: space-between
}

.rl-faq summary:after {
    content: "+";
    color: var(--teal-700);
    font-size: 22px
}

.rl-faq details[open] summary:after {
    content: "−"
}

.rl-faq details p {
    color: var(--muted);
    padding-right: 30px;
    margin: 12px 0 0
}

.rl-contact {
    padding: 34px;
    border-radius: var(--radius);
    background: var(--offwhite);
    border: 1px solid var(--line)
}

.rl-contact label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin: 14px 0
}

.rl-contact input,.rl-contact textarea {
    display: block;
    width: 100%;
    margin-top: 7px;
    padding: 13px 14px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: white;
    font: inherit;
    outline: none
}

.rl-contact input:focus,.rl-contact textarea:focus {
    border-color: var(--teal-600)
}

.rl-footer {
    border-top: 1px solid var(--line);
    padding: 32px 0;
    color: var(--muted);
    font-size: 12px
}

.rl-footer__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px
}

.rl-footer p {
    margin: 0
}

@media(max-width:980px) {
    .rl-nav {
        display: none
    }
    .rl-grid--5 {
        grid-template-columns: repeat(2,1fr)
    }
    .rl-grid--4 {
        grid-template-columns: repeat(2,1fr)
    }
    .rl-hero__grid,.rl-feature,.rl-split,.rl-about,.rl-faq-layout {
        grid-template-columns: 1fr
    }
    .rl-hero__visual {
        max-width: 680px
    }
    .rl-feature,.rl-split,.rl-about,.rl-faq-layout {
        gap: 48px
    }
    .rl-heading-row {
        grid-template-columns: 1fr;
        gap: 10px
    }
    .rl-steps {
        gap: 24px
    }
}

@media(max-width:640px) {
    .rl-container {
        width: min(100% - 32px,1180px)
    }
    .rl-section {
        padding: 64px 0
    }
    .rl-header__row {
        height: 66px
    }
    .rl-header .rl-btn {
        font-size: 0;
        padding: 11px 14px
    }
    .rl-header .rl-btn:after {
        content: "TK →";
        font-size: 13px
    }
    .rl-hero {
        padding-top: 44px
    }
    .rl-hero__grid {
        gap: 36px
    }
    h1 {
        font-size: 40px
    }
    .rl-lead {
        font-size: 18px
    }
    .rl-trust {
        gap: 10px 18px
    }
    .rl-scan {
        min-height: 280px
    }
    .rl-hero-note {
        display: none
    }
    .rl-grid--5,.rl-grid--4,.rl-grid--2,.rl-steps {
        grid-template-columns: 1fr
    }
    .rl-card {
        padding: 22px
    }
    .rl-anatomy {
        grid-template-columns: repeat(2,1fr)
    }
    .rl-tile {
        min-height: 125px
    }
    .rl-cta__inner,.rl-footer__row {
        align-items: flex-start;
        flex-direction: column
    }
    .rl-cta__inner .rl-btn {
        width: 100%;
        justify-content: center
    }
    .rl-contact {
        padding: 24px
    }
}

/* RadioLance - Yoast FAQ */

/* RadioLance - Yoast FAQ Accordion */

.rl-faq .schema-faq-section {
    margin: 0;
    padding: 0;
    border-bottom: 1px solid var(--line);
}

.rl-faq .schema-faq-section:first-child {
    border-top: 1px solid var(--line);
}

.rl-faq .schema-faq-question {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    padding: 22px 50px 22px 0;
    color: var(--navy-900);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    cursor: pointer;
}

/* Plus */

.rl-faq .schema-faq-question::before,
.rl-faq .schema-faq-question::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 4px;
    width: 18px;
    height: 2px;
    background: var(--teal-700);
    border-radius: 2px;
    transition: transform 0.25s ease;
}

.rl-faq .schema-faq-question::after {
    transform: rotate(90deg);
}

/* Answer - closed */

.rl-faq .schema-faq-answer {
    display: none;
    max-width: 900px;
    margin: 0;
    padding: 0 50px 22px 0;
    color: var(--muted);
    font-size: 16px;
    line-height: 1.7;
}

/* Answer - open */

.rl-faq .schema-faq-section.is-open .schema-faq-answer {
    display: block;
}

/* Plus becomes minus */

.rl-faq .schema-faq-section.is-open .schema-faq-question::after {
    transform: rotate(0deg);
}


/* Mobile */

@media (max-width: 767px) {

    .rl-faq .schema-faq-question {
        padding: 18px 42px 18px 0;
        font-size: 17px;
    }

    .rl-faq .schema-faq-answer {
        padding: 0 42px 18px 0;
        font-size: 15px;
        line-height: 1.65;
    }

}