/*
Theme Name: MED-LAND
Theme URI: https://medland.opole.pl/
Author: Samatix
Description: Dedykowany motyw Centrum Ratownictwa MED-LAND na podstawie projektu Glowna.psd.
Version: 1.0.51
Text Domain: medland
*/

:root {
    --navy: #2e4153;
    --navy-soft: #4c6b88;
    --blue: #4eb0e4;
    --blue-light: #57bceb;
    --pale-blue: #e7f6fc;
    --ice: #f7fbfd;
    --white: #ffffff;
    --line: #61b9e7;
    --content: min(94.863636cqw, 2087px);
    --font: "Microsoft YaHei UI", "Microsoft YaHei", Arial, Helvetica, sans-serif;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    overflow-x: hidden;
    color: var(--navy);
    background: var(--white);
    font-family: var(--font);
    font-size: 12px;
    line-height: 1.48;
    -webkit-font-smoothing: antialiased;
}

.site,
.site-header,
.site-main,
.site-footer,
section,
div,
nav,
article,
figure {
    position: relative;
}

.site {
    container-type: inline-size;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

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

button,
input,
textarea {
    font: inherit;
}

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

.content-wide {
    width: min(100%, var(--content));
    margin-inline: auto;
}

.section-pad {
    padding-inline: 20px;
}

/* Header */

.site-header {
    height: min(4.863636cqw, 107px);
    min-height: 0;
    overflow: visible;
    background: var(--white);
    z-index: 20;
}

.header-inner {
    display: grid;
    grid-template-columns:
        3.136364% 26.272727% 10.954545% 19.272727%
        10.363636% 28.181818% 1.818183%;
    grid-template-rows: 100%;
    align-items: start;
    width: 100%;
    height: 100%;
    margin: 0;
}

.header-rule {
    display: block;
    grid-column: 1 / -1;
    grid-row: 1;
    align-self: start;
    height: min(0.181818cqw, 4px);
    margin-top: min(5.5cqw, 121px);
    background: var(--blue);
    z-index: 1;
}

.header-rule-left {
    justify-self: start;
    width: calc(50% - min(10.636364cqw, 234px));
}

.header-rule-right {
    justify-self: end;
    width: calc(50% - min(10.181818cqw, 224px));
}

.header-contact {
    display: grid;
    grid-column: 2;
    grid-row: 1;
    grid-template-columns: 35.813149% 52.422145%;
    align-items: start;
    justify-content: space-between;
    width: 100%;
    margin-top: min(2cqw, 44px);
    color: var(--navy);
    font-size: min(0.954545cqw, 21px);
    line-height: 1;
    white-space: nowrap;
    z-index: 3;
}

.contact-link {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    transition: color 180ms ease;
}

.contact-link:first-child {
    gap: min(0.727273cqw, 16px);
}

.contact-link:last-child {
    gap: min(0.590909cqw, 13px);
}

.contact-link > span:last-child {
    margin-top: min(0.227273cqw, 5px);
}

.contact-link:hover,
.primary-nav a:hover {
    color: var(--blue);
}

.contact-icon,
.contact-icon img {
    display: block;
}

.phone-icon {
    width: min(1.090909cqw, 24px);
    height: min(1.363636cqw, 30px);
}

.contact-icon img {
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.mail-icon {
    width: min(1.954545cqw, 43px);
    height: min(1.318182cqw, 29px);
}


.brand {
    display: block;
    grid-column: 4;
    grid-row: 1;
    align-self: start;
    justify-self: center;
    width: min(100%, 424px);
    height: min(6.863636cqw, 151px);
    overflow: visible;
    background: var(--white);
    border-radius: 0 0 min(1.090909cqw, 24px) min(1.090909cqw, 24px);
    box-shadow: none;
    z-index: 4;
}

.brand img {
    width: 84.669811%;
    height: min(5.590909cqw, 123px);
    margin-top: min(1.818182cqw, 40px);
    margin-left: 6.839623%;
    object-fit: fill;
}

.primary-nav {
    display: flex;
    grid-column: 6;
    grid-row: 1;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    margin-top: min(2.181818cqw, 48px);
    color: var(--navy);
    font-size: min(0.863636cqw, 19px);
    line-height: 1.105263;
    white-space: nowrap;
    z-index: 3;
}

.primary-nav a {
    transition: color 180ms ease;
}

.primary-nav a:last-child {
    font-weight: 700;
}

.menu-toggle {
    display: none;
    align-items: center;
    gap: 8px;
    border: 0;
    color: var(--navy);
    background: transparent;
    cursor: pointer;
}

.menu-bars {
    color: var(--blue);
    font-size: 22px;
}


/* Hero */

.hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    padding-bottom: min(6.045455cqw, 133px);
    background:
        var(--white)
        url("assets/images/hero-film.webp")
        center top / 100% auto no-repeat;
}

.hero-visual {
    display: grid;
    grid-column: 1;
    grid-row: 1;
    aspect-ratio: 2200 / 646;
    width: 100%;
    z-index: 1;
}

.hero-title {
    align-self: start;
    justify-self: center;
    margin: 6.5cqw 0 0;
    transform: translateX(1.477273cqw);
    color: rgba(255, 255, 255, 0.70196);
    font-size: clamp(28px, 3.26cqw, 72px);
    font-weight: 700;
    line-height: 1;
    text-align: center;
}

.hero-card {
    display: grid;
    grid-column: 1;
    grid-row: 1;
    grid-template-columns: min(20.909091cqw, 460px) minmax(0, 1fr);
    width: min(calc(100% - 40px), 86.818182cqw, 1910px);
    min-height: min(25.454545cqw, 560px);
    margin-top: 29.363636cqw;
    margin-inline: auto;
    transform: translateX(1.068182cqw);
    z-index: 2;
}

.hero-person {
    display: grid;
    grid-column: 1;
    grid-row: 1;
    height: min(25.454545cqw, 560px);
    overflow: hidden;
    align-items: start;
    justify-items: start;
    z-index: 2;
}

.hero-person img {
    width: min(18.636364cqw, 410px);
    margin-left: min(2cqw, 44px);
}

.hero-message {
    display: grid;
    grid-column: 1 / -1;
    grid-row: 1;
    grid-template-rows: min(11.090909cqw, 244px) min(1.363636cqw, 30px) min(6.363636cqw, 140px) min(2.545455cqw, 56px);
    height: min(21.363636cqw, 470px);
    margin-top: min(4.090909cqw, 90px);
    overflow: visible;
    border-radius: min(1.636364cqw, 36px);
    background: var(--navy);
    z-index: 1;
}

.hero-message-top {
    display: grid;
    grid-row: 1;
    align-content: center;
    min-height: min(11.090909cqw, 244px);
    padding: min(1.909091cqw, 42px) min(3.090909cqw, 68px) min(1.636364cqw, 36px);
    color: var(--white);
}

.hero-message-top p {
    margin-bottom: min(0.363636cqw, 8px);
    font-size: min(2.181818cqw, 48px);
    text-align: center;
    transform: translateX(1.477273cqw);
}

.hero-message-top h2 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: min(0.909091cqw, 20px);
    margin-bottom: 0;
    transform: translateX(-0.454545cqw);
    font-size: min(2.727273cqw, 60px);
    line-height: 1.15;
}

.hero-message-top h2 span {
    width: min(1.181818cqw, 26px);
    height: min(4.272727cqw, 94px);
    background: var(--blue);
}

.hero-message-bottom {
    display: grid;
    grid-row: 3;
    min-height: min(6.363636cqw, 140px);
    margin: 0 min(4.636364cqw, 102px) 0 min(12.045455cqw, 265px);
    padding: min(1.090909cqw, 24px) min(1.545455cqw, 34px) min(1.090909cqw, 24px) min(9.636364cqw, 212px);
    place-items: center;
    color: var(--white);
    background: var(--blue);
    border-radius: 0 min(1.636364cqw, 36px) min(1.636364cqw, 36px) 0;
    font-size: min(2.181818cqw, 48px);
    font-weight: 700;
    text-align: center;
}


/* Intro */


.intro {
    padding-top: 0;
    padding-bottom: min(10.409091cqw, 229px);
}

.narrow-copy {
    width: 100%;
    margin-inline: auto;
    color: var(--navy);
    text-align: center;
}

.narrow-copy > p:first-child {
    width: min(calc(100% - 40px), 65.272727cqw, 1436px);
    margin: 0 auto min(2.018182cqw, 44.4px);
    transform: translateX(min(0.744227cqw, 16.373px));
    font-size: min(1.090909cqw, 24px);
    line-height: 1.2;
}

.service-list {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(calc(100% - 40px), 71.818182cqw, 1580px);
    margin: 0 auto min(4.136364cqw, 91px);
    padding: 0;
    transform: translateX(calc(-1 * min(0.272727cqw, 6px)));
    gap: min(3.363636cqw, 74px);
    color: var(--blue);
    font-size: min(1.090909cqw, 24px);
    font-weight: 700;
    line-height: 1.2;
    list-style: none;
}

.service-list li {
    display: inline-flex;
    align-items: center;
    gap: min(0.818182cqw, 18px);
    white-space: nowrap;
}

.service-list li::before {
    display: inline-block;
    flex: 0 0 auto;
    width: min(1.772727cqw, 39px);
    height: min(1.772727cqw, 39px);
    content: "";
    background: url("assets/images/service-mark.png") center / contain no-repeat;
}

.intro-summary {
    width: min(calc(100% - 40px), 65.272727cqw, 1436px);
    margin: 0 auto;
    transform: translateX(min(0.744227cqw, 16.373px));
    color: var(--navy);
    font-size: min(1.090909cqw, 24px);
    font-weight: 700;
    line-height: 1.2;
}

/* Courses */

.courses {
    padding-bottom: min(8.045455cqw, 177px);
}

.section-heading-line {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: min(1.454545cqw, 32px);
    margin-bottom: min(2.772727cqw, 61px);
}

.section-heading-line span {
    height: min(0.181818cqw, 4px);
    background: var(--line);
}

.section-heading-line h2 {
    margin: 0;
    color: var(--navy);
    font-size: min(1.090909cqw, 24px);
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
}

.course-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: min(3.431818cqw, 75.5px);
}

.course-card {
    display: grid;
    grid-template-rows: auto 1fr min(1.681818cqw, 37px);
    min-height: min(14.090909cqw, 310px);
    overflow: hidden;
    padding: min(0.909091cqw, 20px) min(0.772727cqw, 17px) min(0.636364cqw, 14px);
    color: var(--white);
    background:
        radial-gradient(
            ellipse min(24.113636cqw, 530.5px) min(6.136364cqw, 135px)
            at min(7.477273cqw, 164.5px) calc(-1 * min(1.545455cqw, 34px)),
            #78c4ed 0 99.7%,
            transparent 100%
        ),
        #4eb0e4;
    border-radius: min(1.363636cqw, 30px);
}

.course-card img {
    width: min(9.181818cqw, 202px);
    margin: 0 auto;
}

.course-card h3 {
    align-self: start;
    justify-self: center;
    margin: min(2.227273cqw, 49px) 0 0;
    color: var(--navy);
    font-size: min(1.090909cqw, 24px);
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
}

.course-card a {
    display: grid;
    grid-template-columns: auto min(3.863636cqw, 85px);
    align-items: center;
    justify-self: end;
    gap: min(0.545455cqw, 12px);
    font-family: "Microsoft YaHei UI Light", var(--font);
    font-size: min(0.818182cqw, 18px);
    font-weight: 300;
    line-height: 1.2;
}

.course-arrow {
    display: block;
    width: min(3.863636cqw, 85px);
    height: min(1.681818cqw, 37px);
    color: var(--white);
    overflow: visible;
    transform: translateY(calc(-1 * min(0.019886cqw, 0.4375px)));
}

/* About */

.about {
    display: grid;
    height: min(36cqw, 792px);
    min-height: 0;
    overflow: hidden;
    padding: 0;
    background: var(--white);
}

.about-backdrop,
.about-grid {
    grid-area: 1 / 1;
    width: 100%;
    height: 100%;
}

.about-backdrop {
    display: grid;
    pointer-events: none;
}

.about-band {
    display: block;
    grid-area: 1 / 1;
    width: 100%;
    height: 100%;
}

.about-band-primary {
    background: rgba(78, 176, 228, 0.10196);
    clip-path: polygon(0 14.646%, 100% 3.409%, 100% 87.121%, 0 98.485%);
}

.about-band-secondary {
    background:
        radial-gradient(
            ellipse 17.659% 44.129% at 90.114% 70.013%,
            rgba(209, 234, 248, 0.10196) 0 99.4%,
            rgba(78, 176, 228, 0.10196) 100%
        );
    clip-path: polygon(0 10.859%, 100% 6.187%, 100% 89.899%, 0 94.571%);
}

.about-grid {
    display: grid;
    grid-template-columns: 32.5% 44.727273% 22.772727%;
    align-items: start;
    gap: 0;
    max-width: none;
    min-width: 0;
    margin: 0;
    z-index: 1;
}

.about-image {
    display: grid;
    grid-column: 1;
    align-self: start;
    justify-items: start;
    margin-top: min(0.272727cqw, 6px);
}

.about-image img {
    width: min(49.954545cqw, 1099px);
    max-width: none;
    margin-left: calc(-1 * min(6.5cqw, 143px));
    transform: none;
}

.about-copy {
    grid-column: 2;
    align-self: start;
    width: min(58.954545cqw, 1297px);
    margin-top: min(9cqw, 198px);
    color: var(--navy);
    font-size: min(1.090909cqw, 24px);
    line-height: 1.2;
    letter-spacing: calc(-1 * min(0.002364cqw, 0.052px));
}

.about-copy p {
    margin: 0;
}

.about-copy p:first-child {
    width: min(58.954545cqw, 1297px);
    margin-bottom: min(4.254545cqw, 93.6px);
    font-weight: 700;
    text-align: left;
}

.about-copy p:nth-child(2),
.about-copy p:nth-child(3) {
    width: min(41.454545cqw, 912px);
    hyphens: auto;
    text-align: justify;
    text-align-last: left;
}

.about-copy p:nth-child(2) {
    margin-bottom: min(1.309091cqw, 28.8px);
}

.about-logo {
    display: grid;
    grid-column: 3;
    align-self: start;
    justify-items: start;
    margin-top: min(13.318182cqw, 293px);
}

.about-logo img {
    width: min(15.818182cqw, 348px);
    height: min(14.136364cqw, 311px);
    object-fit: fill;
}

/* Training */

.training {
    padding: min(10.227273cqw, 225px) 0 0;
    background: var(--white);
}

.training > .content-wide {
    width: 100%;
    max-width: none;
    margin: 0;
}

.training-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: min(39.545455cqw, 870px);
    width: 100%;
    height: min(39.545455cqw, 870px);
    min-height: 0;
    overflow: hidden;
    background: none;
}

.training-grid::before {
    display: block;
    grid-area: 1 / 1;
    align-self: start;
    width: 100%;
    height: min(32.318182cqw, 711px);
    margin-top: min(3.272727cqw, 72px);
    content: "";
    background: rgba(78, 176, 228, 0.388235);
    z-index: 1;
}

.training-lead,
.training-photo {
    grid-area: 1 / 1;
    align-self: start;
}

.training-lead {
    display: grid;
    width: 100%;
    height: 100%;
    padding: 0;
    z-index: 4;
}

.training-lead::before {
    display: block;
    grid-area: 1 / 1;
    align-self: start;
    width: min(40.727273cqw, 896px);
    height: min(9.272727cqw, 204px);
    margin-top: min(6.454545cqw, 142px);
    margin-left: calc(-1 * min(3.318182cqw, 73px));
    content: "";
    background: rgba(255, 255, 255, 0.611765);
}

.training-lead h2,
.training-lead .short-line,
.training-lead p {
    grid-area: 1 / 1;
    align-self: start;
}

.training-lead h2 {
    width: min(31.681818cqw, 697px);
    margin: min(7.409091cqw, 163px) 0 0 min(4.727273cqw, 104px);
    color: var(--navy);
    font-size: min(2.181818cqw, 48px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: calc(-1 * min(0.005cqw, 0.11px));
    text-align: left;
}

.training-lead .short-line {
    display: block;
    width: min(15cqw, 330px);
    height: min(0.954545cqw, 21px);
    margin: min(13.5cqw, 297px) 0 0 min(16.590909cqw, 365px);
    background: var(--blue);
}

.training-lead p {
    width: min(32.136364cqw, 707px);
    margin: 0 0 0 min(4.590909cqw, 101px);
    color: var(--navy);
    font-size: min(1.090909cqw, 24px);
    line-height: 1.2;
}

.training-lead p:first-of-type {
    margin-top: min(20.136364cqw, 443px);
}

.training-lead p:nth-of-type(2) {
    margin-top: min(25.363636cqw, 558px);
}

.training-photo {
    display: grid;
    width: min(59.227273cqw, 1303px);
    height: min(39.545455cqw, 870px);
    margin: 0 0 0 min(38.454545cqw, 846px);
    overflow: visible;
    box-shadow: none;
    z-index: 2;
}

.training-photo img,
.training-photo::after {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
}

.training-photo img {
    width: 100%;
    height: 100%;
    object-fit: fill;
    z-index: 1;
}

.training-photo::after {
    width: min(65.181818cqw, 1434px);
    height: min(35.863636cqw, 789px);
    margin-top: min(1.318182cqw, 29px);
    margin-left: min(2cqw, 44px);
    content: "";
    background: rgba(78, 176, 228, 0.509804);
    z-index: 2;
}

.training-detail {
    width: min(71cqw, 1562px);
    max-width: none;
    margin: min(1.045455cqw, 23px) 0 0 min(8.727273cqw, 192px);
    color: var(--navy);
    font-size: min(1.090909cqw, 24px);
    line-height: 1.2;
}

.training-detail p {
    margin: 0;
}

.training-detail p:first-child {
    margin-bottom: min(1.336364cqw, 29.4px);
}

.training-detail strong {
    letter-spacing: calc(-1 * min(0.000909cqw, 0.02px));
}

.training-promise {
    display: grid;
    grid-template-columns:
        min(54.136364cqw, 1191px)
        min(0.636364cqw, 14px)
        min(12.954545cqw, 285px)
        min(0.454545cqw, 10px)
        min(19.454545cqw, 428px);
    align-items: stretch;
    width: min(87.636364cqw, 1928px);
    height: min(4.272727cqw, 94px);
    min-height: 0;
    margin: min(2.063636cqw, 45.4px) 0 0 min(8.5cqw, 187px);
    color: var(--white);
    background: transparent;
    border-radius: 0;
}

.training-promise > strong {
    display: flex;
    grid-column: 1;
    align-items: center;
    padding: 0 0 0 min(1.409091cqw, 31px);
    color: var(--white);
    background: var(--blue);
    font-size: min(1.363636cqw, 30px);
    line-height: 1.2;
    text-align: left;
}

.training-logo {
    display: grid;
    grid-column: 3;
    place-items: center;
    background: var(--navy);
}

.training-logo img {
    width: min(11.636364cqw, 256px);
    height: min(3.954545cqw, 87px);
    object-fit: fill;
}

.training-contact {
    display: grid;
    grid-column: 5;
    width: 100%;
    height: 100%;
    border-bottom: min(0.363636cqw, 8px) solid var(--blue);
    transform: translateY(calc(-1 * min(0.045455cqw, 1px)));
}

.training-contact a {
    display: grid;
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    align-items: start;
    padding: 0;
    color: var(--navy);
    font-size: min(0.954545cqw, 21px);
    line-height: 1.2;
}

.training-phone {
    grid-template-columns: min(1.090909cqw, 24px) auto;
    gap: min(0.772727cqw, 17px);
    margin-top: min(0.136364cqw, 3px);
    margin-left: min(0.363636cqw, 8px);
    font-weight: 700;
}

.training-mail {
    grid-template-columns: min(1.954545cqw, 43px) auto;
    gap: min(0.590909cqw, 13px);
    margin-top: min(2.227273cqw, 49px);
    margin-left: min(0.181818cqw, 4px);
    font-weight: 400;
}

.training-phone img {
    width: min(1.090909cqw, 24px);
    height: min(1.363636cqw, 30px);
}

.training-mail img {
    width: min(1.954545cqw, 43px);
    height: min(1.318182cqw, 29px);
}

.training-contact a > span {
    margin-top: min(0.227273cqw, 5px);
    white-space: nowrap;
}

/* Credibility */

.credibility {
    display: grid;
    width: 100%;
    height: min(51.818182cqw, 1140px);
    min-height: 0;
    margin-top: calc(-1 * min(0.384943cqw, 8.46875px));
    padding: 0;
    background: url("assets/images/credibility-geometry.png") calc(-1 * min(7.454545cqw, 164px)) 0 / min(100cqw, 2200px) min(51.818182cqw, 1140px) no-repeat;
}

.credibility p {
    align-self: start;
    justify-self: start;
    margin: min(17.590909cqw, 387px) 0 0 min(25.454545cqw, 560px);
    color: #6486a4;
    font-size: min(1.090909cqw, 24px);
    line-height: 1.125;
}

/* Results */

.results {
    display: grid;
    width: 100%;
    height: min(35.681818cqw, 785px);
    min-height: 0;
    margin-top: calc(-1 * min(7.045455cqw, 155px));
    padding: 0;
    background: none;
}

.results::before {
    display: block;
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    width: calc(100% - min(48.727273cqw, 1072px));
    height: min(27.727273cqw, 610px);
    margin-top: min(4.136364cqw, 91px);
    margin-left: min(48.727273cqw, 1072px);
    content: "";
    background: #f1f1f1;
    border-radius: min(0.909091cqw, 20px);
}

.results-grid {
    display: grid;
    grid-area: 1 / 1;
    grid-template-columns: min(59.636364cqw, 1312px) 1fr;
    gap: 0;
    align-items: start;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.stats-grid {
    display: grid;
    grid-column: 1;
    grid-template-columns: repeat(2, min(22.909091cqw, 504px));
    grid-template-rows:
        min(8.227273cqw, 181px)
        min(8.318182cqw, 183px)
        min(1.636364cqw, 36px)
        min(8.227273cqw, 181px)
        min(8.318182cqw, 183px);
    column-gap: min(1.409091cqw, 31px);
    width: min(47.227273cqw, 1039px);
    height: min(34.727273cqw, 764px);
    margin-left: min(7.772727cqw, 171px);
}

.stat-card {
    display: grid;
    grid-template: 1fr / 1fr;
    width: min(22.909091cqw, 504px);
    height: min(8.318182cqw, 183px);
    min-height: 0;
    padding: 0;
    color: var(--white);
    border-radius: min(0.909091cqw, 20px);
    overflow: hidden;
}

.stat-card:nth-child(1),
.stat-card:nth-child(2) { grid-row: 1; }

.stat-card:nth-child(3),
.stat-card:nth-child(4) { grid-row: 2; }

.stat-card:nth-child(5),
.stat-card:nth-child(6) { grid-row: 4; }

.stat-card:nth-child(7),
.stat-card:nth-child(8) { grid-row: 5; }

.stat-dark { background: #4c6b88; }
.stat-light { background: #4eb0e4; }

.stat-card strong {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    margin-top: min(3.090909cqw, 68px);
    margin-left: min(2.545455cqw, 56px);
    font-size: min(3.272727cqw, 72px);
    font-weight: 400;
    line-height: 1;
}

.stat-card span {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    width: min(9.772727cqw, 215px);
    margin-top: min(3.772727cqw, 83px);
    margin-left: min(10cqw, 220px);
    font-size: min(1.636364cqw, 36px);
    font-weight: 700;
    line-height: 1;
    text-align: center;
}

.results-copy {
    display: grid;
    grid-column: 2;
    grid-template: 1fr / 1fr;
    width: min(36.727273cqw, 808px);
    height: min(32.409091cqw, 713px);
    padding: 0;
    color: #4c6b88;
}

.instructors-title {
    display: grid;
    grid-area: 1 / 1;
    grid-template: 1fr / 1fr;
    align-self: start;
    justify-self: start;
    width: min(24.636364cqw, 542px);
    height: min(6cqw, 132px);
    margin-top: calc(-1 * min(1.818182cqw, 40px));
}

.instructors-title > img:first-child {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    width: min(5.954545cqw, 131px);
    height: min(4.772727cqw, 105px);
    margin-top: min(1.772727cqw, 39px);
}

.instructors-circle {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    width: min(5.181818cqw, 114px);
    height: min(6cqw, 132px);
    margin-left: min(11.863636cqw, 261px);
}

.instructors-title h2 {
    display: grid;
    grid-area: 1 / 1;
    grid-template: 1fr / 1fr;
    width: min(24.636364cqw, 542px);
    height: min(6cqw, 132px);
    margin: 0;
    color: var(--navy);
    font-size: min(1.363636cqw, 30px);
    font-weight: 400;
    line-height: 1.1;
}

.instructors-title h2 > span,
.instructors-title h2 > strong {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    white-space: nowrap;
}

.instructors-prefix {
    margin-top: min(2.272727cqw, 50px);
    margin-left: min(8.363636cqw, 184px);
}

.instructors-title h2 > strong {
    margin-top: min(2.045455cqw, 45px);
    margin-left: min(13.045455cqw, 287px);
    color: var(--blue);
    font-size: min(2.181818cqw, 48px);
    font-weight: 700;
    line-height: 1;
}

.instructors-suffix {
    margin-top: min(2.272727cqw, 50px);
    margin-left: min(16.454545cqw, 362px);
}

.results-lead {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    width: min(33.545455cqw, 738px);
    margin: min(6.590909cqw, 145px) 0 0 calc(-1 * min(0.409091cqw, 9px));
    color: var(--blue);
    font-size: min(1.363636cqw, 30px);
    font-weight: 700;
    line-height: 1.4;
}

.results-arrow {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    width: min(30.818182cqw, 678px);
    height: min(1.590909cqw, 35px);
    margin-top: min(12.227273cqw, 269px);
    margin-left: calc(-1 * min(1.954545cqw, 43px));
}

.results-copy > p:not(.results-lead) {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    width: min(32.772727cqw, 721px);
    margin: min(15.681818cqw, 345px) 0 0 calc(-1 * min(0.136364cqw, 3px));
    color: #4c6b88;
    font-size: min(1.090909cqw, 24px);
    line-height: 1.75;
}

.results-copy ul {
    display: grid;
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    gap: 0;
    width: min(36.772727cqw, 809px);
    margin: min(19.818182cqw, 436px) 0 0 calc(-1 * min(0.681818cqw, 15px));
    padding: 0;
    color: #4c6b88;
    font-size: min(1.090909cqw, 24px);
    font-weight: 700;
    line-height: 1.75;
    list-style: none;
}

.results-copy li::before { content: "- "; }

.stat-card small {
    display: block;
    margin-top: min(0.272727cqw, 6px);
    font-size: min(1.090909cqw, 24px);
    font-weight: 700;
    line-height: 1.25;
}

.stat-card:nth-child(5) strong { margin-left: min(2.454545cqw, 54px); }

.stat-card:nth-child(4) strong,
.stat-card:nth-child(6) strong { margin-left: min(2.409091cqw, 53px); }

.stat-card:nth-child(8) strong { margin-left: min(2.454545cqw, 54px); }

.stat-card:nth-child(3) strong { margin-top: min(2.681818cqw, 59px); }

.stat-card:nth-child(4) strong { margin-top: min(2.727273cqw, 60px); }

.stat-card:nth-child(5) strong,
.stat-card:nth-child(6) strong { margin-top: min(3.136364cqw, 69px); }

.stat-card:nth-child(7) strong {
    margin-top: min(2.727273cqw, 60px);
    margin-left: min(2.272727cqw, 50px);
}

.stat-card:nth-child(8) strong { margin-top: min(2.727273cqw, 60px); }

.stat-card:nth-child(1) span,
.stat-card:nth-child(2) span {
    width: min(15.681818cqw, 345px);
    margin-left: min(6.971591cqw, 153.375px);
    white-space: nowrap;
}

.stat-card:nth-child(3) span {
    width: min(15.227273cqw, 335px);
    margin-top: min(0.818182cqw, 18px);
    margin-left: min(6.971591cqw, 153.375px);
    font-size: min(1.363636cqw, 30px);
    line-height: 1.4;
}

.stat-card:nth-child(4) span {
    width: min(8.045455cqw, 177px);
    margin-top: min(2.318182cqw, 51px);
    margin-left: min(10.590909cqw, 233px);
    font-size: min(1.363636cqw, 30px);
    line-height: 1.4;
}

.stat-card:nth-child(5) span {
    width: min(15.681818cqw, 345px);
    margin-top: min(2.363636cqw, 52px);
    margin-left: min(6.971591cqw, 153.375px);
    line-height: 1.125;
    white-space: nowrap;
}

.stat-card:nth-child(6) span {
    width: min(7.863636cqw, 173px);
    margin-top: min(3.772727cqw, 83px);
    margin-left: min(10.909091cqw, 240px);
    line-height: 1;
}

.stat-card:nth-child(7) span {
    width: min(10.454545cqw, 230px);
    margin-top: min(2.409091cqw, 53px);
    margin-left: min(9.363636cqw, 206px);
    font-size: min(1.363636cqw, 30px);
    line-height: 1.4;
}

.stat-card:nth-child(8) span {
    width: min(15.545455cqw, 342px);
    margin-top: min(1.818182cqw, 40px);
    margin-left: min(6.971591cqw, 153.375px);
    font-size: min(1.363636cqw, 30px);
    line-height: 1.4;
    white-space: nowrap;
}

/* References */

.references {
    display: grid;
    width: 100%;
    height: min(36.772727cqw, 809px);
    min-height: 0;
    padding: 0;
    background: var(--white);
}

.references-grid,
.references-copy {
    display: grid;
    grid-area: 1 / 1;
    grid-template: 1fr / 1fr;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
}

.references-copy h2,
.references-copy p,
.copy-arrow {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
}

.references-copy h2 {
    width: min(28.954545cqw, 637px);
    margin: min(9.818182cqw, 216px) 0 0 min(7.772727cqw, 171px);
    color: var(--blue);
    font-size: min(1.636364cqw, 36px);
    font-weight: 700;
    line-height: 1.2;
}

.references-copy p {
    width: min(23.681818cqw, 521px);
    margin: min(17.863636cqw, 393px) 0 0 min(7.954545cqw, 175px);
    color: #2d4152;
    font-size: min(1.090909cqw, 24px);
    line-height: 1.2;
}

.copy-arrow {
    width: min(3.636364cqw, 80px);
    height: min(1.590909cqw, 35px);
    margin: min(21.863636cqw, 481px) 0 0 min(23.954545cqw, 527px);
}

.references-visual {
    display: block;
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    width: min(57.363636cqw, 1262px);
    height: min(20.863636cqw, 459px);
    margin: min(9.545455cqw, 210px) 0 0 min(36.636364cqw, 806px);
    object-fit: fill;
    pointer-events: none;
}

/* Experience */

.experience {
    display: grid;
    width: 100%;
    height: min(48.636364cqw, 1070px);
    min-height: 0;
    padding: 0;
    overflow: visible;
    background: var(--white);
}

.experience::before {
    display: block;
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    width: calc(100% - min(6.136364cqw, 135px));
    height: min(51.818182cqw, 1140px);
    margin-top: calc(-1 * min(3.181818cqw, 70px));
    margin-left: min(6.136364cqw, 135px);
    content: "";
    background: url("assets/images/experience-geometry.png") left top / min(100cqw, 2200px) min(51.818182cqw, 1140px) no-repeat;
}

.experience-inner {
    display: grid;
    grid-area: 1 / 1;
    grid-template: 1fr / 1fr;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
    text-align: center;
}

.experience-logo,
.experience h2,
.experience-inner > p,
.experience hr {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
}

.experience-logo {
    width: min(7.272727cqw, 160px);
    height: min(6.409091cqw, 141px);
    margin: min(3.318182cqw, 73px) 0 0 min(47.909091cqw, 1054px);
}

.experience h2 {
    display: grid;
    grid-template: 1fr / 1fr;
    width: 100%;
    height: 100%;
    margin: 0;
    color: #2d4152;
    font-size: min(2.727273cqw, 60px);
    font-weight: 700;
    line-height: 1;
}

.experience h2 > span,
.experience h2 > b,
.experience h2 > strong {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
    font-size: inherit;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

.experience h2 > span {
    margin-top: min(11.942614cqw, 262.7375px);
    margin-left: min(29.289727cqw, 644.374px);
    color: #2d4152;
}

.experience h2 > b {
    margin-top: min(11.9875cqw, 263.725px);
    margin-left: min(50.517cqw, 1111.374px);
    color: var(--blue);
}

.experience h2 > strong {
    margin-top: min(11.942614cqw, 262.7375px);
    margin-left: min(53.517cqw, 1177.374px);
    color: #2d4152;
}

.experience-inner > p:not(.experience-callout) {
    width: min(62.909091cqw, 1384px);
    max-width: none;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: min(17.880636cqw, 393.374px);
    color: var(--navy);
    font-size: min(1.090909cqw, 24px);
    font-weight: 400;
    line-height: 1.2;
    text-align: center;
}

.experience-inner > p:nth-of-type(1) { margin-top: min(20.033523cqw, 440.7375px); }
.experience-inner > p:nth-of-type(2) { margin-top: min(24.987614cqw, 549.7275px); }
.experience-inner > p:nth-of-type(3) { margin-top: min(29.942159cqw, 658.7275px); }

.experience hr {
    width: min(12.772727cqw, 281px);
    height: min(0.181818cqw, 4px);
    margin-right: 0;
    margin-bottom: 0;
    margin-left: min(43.863636cqw, 965px);
    border: 0;
    background: var(--blue);
}

.experience hr:nth-of-type(1) { margin-top: min(23.545455cqw, 518px); }
.experience hr:nth-of-type(2) { margin-top: min(28.727273cqw, 632px); }
.experience hr:nth-of-type(3) { margin-top: min(34.090909cqw, 750px); }

.experience-callout {
    display: grid;
    place-items: center;
    width: min(72.454545cqw, 1594px);
    height: min(6.090909cqw, 134px);
    margin: min(36.818182cqw, 810px) 0 0 min(14.636364cqw, 322px);
    padding: min(0.363636cqw, 8px) min(2.090909cqw, 46px) 0;
    color: var(--white);
    background: #2d4152;
    border-radius: min(1.545455cqw, 34px);
    font-size: min(1.090909cqw, 24px);
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
}

/* Offer and contact */

.offer {
    display: grid;
    width: 100%;
    height: min(48.909091cqw, 1076px);
    min-height: 0;
    padding: 0;
    background: var(--white);
}

.offer-grid,
.offer-visual,
.offer-copy {
    display: grid;
    grid-area: 1 / 1;
    grid-template: 1fr / 1fr;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
}

.offer-visual > img,
.contact-card,
.form-button,
.offer-copy h2,
.offer-copy > p,
.offer-list {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
}

.offer-visual > img {
    width: min(35cqw, 770px);
    height: min(23.227273cqw, 511px);
    margin: min(2.636364cqw, 58px) 0 0 min(7.363636cqw, 162px);
}

.contact-card {
    display: grid;
    grid-template: 1fr / 1fr;
    width: min(39.090909cqw, 860px);
    height: min(8.727273cqw, 192px);
    margin: min(28.454545cqw, 626px) 0 0 min(6.545455cqw, 144px);
    padding: 0;
    box-sizing: border-box;
    color: var(--white);
    background: var(--blue);
    border-radius: min(1.181818cqw, 26px);
}

.contact-card h2,
.contact-card div {
    grid-area: 1 / 1;
    align-self: start;
    justify-self: start;
}

.contact-card h2 {
    width: min(37.090909cqw, 816px);
    margin: min(1.363636cqw, 30px) 0 0 min(1cqw, 22px);
    font-size: min(1.727273cqw, 38px);
    font-weight: 700;
    line-height: 1.2;
}

.contact-card div {
    display: grid;
    grid-template-columns: min(10cqw, 220px) min(14cqw, 308px);
    gap: min(2.545455cqw, 56px);
    width: min(26.454545cqw, 582px);
    margin: min(5cqw, 110px) 0 0 min(3.636364cqw, 80px);
    font-size: min(0.909091cqw, 20px);
    line-height: 1.48;
    white-space: nowrap;
}

.contact-card a {
    display: grid;
    align-items: center;
}

.contact-card a::before {
    display: block;
    content: "";
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.contact-card a:first-child {
    grid-template-columns: min(1.454545cqw, 32px) 1fr;
    gap: min(0.363636cqw, 8px);
}

.contact-card a:first-child::before {
    width: min(1.454545cqw, 32px);
    height: min(1.454545cqw, 32px);
    background-image: url("assets/images/icon-phone.webp");
}

.contact-card a:last-child {
    grid-template-columns: min(2cqw, 44px) 1fr;
    gap: min(0.545455cqw, 12px);
}

.contact-card a:last-child::before {
    width: min(2cqw, 44px);
    height: min(1.454545cqw, 32px);
    background-image: url("assets/images/icon-mail.webp");
}

.form-button {
    display: grid;
    width: min(15.909091cqw, 350px);
    height: min(2.636364cqw, 58px);
    margin: min(38.454545cqw, 846px) 0 0 min(29.636364cqw, 652px);
    padding: 0;
    place-items: center;
    color: var(--white);
    background: var(--blue);
    border-radius: min(0.727273cqw, 16px);
    font-size: min(1cqw, 22px);
    font-weight: 700;
    line-height: 1;
}

.offer-copy h2 {
    width: min(45.454545cqw, 1000px);
    margin: min(2.636364cqw, 58px) 0 0 min(43.818182cqw, 964px);
    color: var(--blue);
    font-size: min(1.818182cqw, 40px);
    font-weight: 700;
    line-height: 1.2;
}

.offer-copy > p {
    width: min(45.454545cqw, 1000px);
    margin: min(6.454545cqw, 142px) 0 0 min(43.818182cqw, 964px);
    color: #2d4152;
    font-size: min(1.090909cqw, 24px);
    font-weight: 400;
    line-height: 1.15;
}

.offer-list {
    display: grid;
    gap: min(1.409091cqw, 31px);
    width: min(39.090909cqw, 860px);
    margin: min(12.909091cqw, 284px) 0 0 min(50.272727cqw, 1106px);
    padding: 0;
    color: #2d4152;
    font-size: min(1.090909cqw, 24px);
    line-height: 1.2;
    list-style: none;
}

.offer-list li {
    display: grid;
    grid-template-columns: min(1.636364cqw, 36px) 1fr;
    gap: min(0.727273cqw, 16px);
    align-items: start;
}

.offer-list li::before {
    width: min(1.636364cqw, 36px);
    height: min(1.636364cqw, 36px);
    content: "";
    background: url("assets/images/service-mark.png") center / contain no-repeat;
}

/* Footer */

.site-footer {
    width: 100%;
    height: min(6cqw, 132px);
    min-height: 0;
    color: var(--white);
    background: var(--navy);
}

.footer-main {
    display: grid;
    width: 100%;
    height: 100%;
    min-height: 0;
    background:
        linear-gradient(rgba(46, 65, 83, 0.83), rgba(46, 65, 83, 0.83)),
        url("assets/images/geometry.webp") left 38% / 860px auto no-repeat;
}

/* Responsive */

@media (max-width: 1000px) {
    .course-grid {
        gap: 16px;
    }

    .results-grid {
        grid-template-columns: minmax(410px, 1fr) 0.9fr;
        gap: 30px;
    }

    .training-promise {
        grid-template-columns: 1fr 120px;
    }

    .training-promise a {
        display: none;
    }
}

@media (max-width: 780px) {
    body {
        font-size: 13px;
    }

    .site-header {
        height: auto;
        min-height: 0;
        overflow: visible;
    }

    .header-inner {
        grid-template-columns: 1fr auto;
        width: min(calc(100% - 30px), 720px);
        padding: 10px 0;
        gap: 10px 16px;
    }

    .header-contact {
        grid-column: 1 / -1;
        grid-row: 1;
        justify-content: center;
        font-size: 9px;
    }

    .brand {
        grid-column: 1;
        grid-row: 2;
        width: 155px;
    }

    .menu-toggle {
        display: inline-flex;
        grid-column: 2;
        grid-row: 2;
    }

    .primary-nav {
        display: none;
        grid-column: 1 / -1;
        grid-row: 3;
        flex-wrap: wrap;
        justify-content: center;
        padding: 15px;
        color: var(--white);
        background: var(--navy);
        border-radius: 8px;
        font-size: 12px;
    }

    .primary-nav.is-open {
        display: flex;
    }

    .hero {
        padding-bottom: 55px;
    }

    .hero-visual {
        aspect-ratio: 1.85 / 1;
    }

    .hero-title {
        transform: none;
    }

    .hero-card {
        grid-template-columns: 145px 1fr;
        width: min(calc(100% - 24px), 620px);
        min-height: 190px;
        margin-top: 54.054054cqw;
        transform: none;
    }

    .hero-person {
        display: flex;
        height: 190px;
        align-items: flex-start;
        justify-content: center;
        background:
            linear-gradient(
                to bottom,
                transparent 0 25px,
                var(--navy) 25px 127px,
                var(--blue) 127px 175px,
                transparent 175px
            );
    }

    .hero-person img {
        width: 140px;
        margin-left: 0;
    }

    .hero-message {
        grid-column: 2;
        grid-template-rows: 102px 48px;
        height: 150px;
        margin-top: 25px;
        overflow: hidden;
        border-radius: 0 18px 18px 0;
        background: transparent;
    }

    .hero-message-top {
        grid-row: 1;
        min-height: 102px;
        padding: 14px 12px;
        background: var(--navy);
    }

    .hero-message-top p {
        font-size: 13px;
        transform: none;
    }

    .hero-message-top h2 {
        font-size: 20px;
        transform: none;
    }

    .hero-message-top h2 span {
        width: 8px;
        height: 33px;
    }

    .hero-message-bottom {
        grid-row: 2;
        min-height: 48px;
        margin: 0;
        padding: 9px 12px;
        border-radius: 0;
        font-size: 14px;
    }

    .intro {
        padding-bottom: 75px;
    }

    .narrow-copy > p:first-child,
    .intro-summary {
        width: 100%;
        transform: none;
        font-size: 12px;
    }

    .service-list {
        width: 100%;
        flex-wrap: wrap;
        gap: 20px 30px;
        margin-bottom: 40px;
        transform: none;
        font-size: 12px;
    }

    .service-list li {
        gap: 9px;
    }

    .service-list li::before {
        width: 18px;
        height: 18px;
    }

    .service-list li {
        justify-content: center;
        white-space: normal;
        text-align: center;
    }

    .section-heading-line {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .course-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .section-heading-line h2 {
        font-size: 12px;
    }

    .course-card {
        grid-template-rows: auto 1fr 18.5px;
        min-height: 175px;
        padding: 10px 8.5px 7px;
        background:
            radial-gradient(ellipse 265.25px 67.5px at 82.25px -17px, #78c4ed 0 99.7%, transparent 100%),
            #4eb0e4;
        border-radius: 15px;
    }

    .course-card img {
        width: 101px;
    }

    .course-card h3 {
        margin-top: 25px;
        font-size: 12px;
    }

    .course-card a {
        grid-template-columns: auto 42.5px;
        gap: 6px;
        font-size: 9px;
    }

    .course-arrow {
        width: 42.5px;
        height: 18.5px;
    }

    .about {
        height: auto;
        min-height: 0;
        padding: 50px 20px 55px;
    }

    .about-grid {
        grid-template-columns: 1fr;
        width: 100%;
        height: auto;
        gap: 32px;
    }

    .about-image {
        grid-column: 1;
        justify-items: center;
        margin-top: 0;
    }

    .about-image img {
        width: 300px;
        max-width: 100%;
        margin-left: 0;
        transform: none;
    }

    .about-copy {
        grid-column: 1;
        width: 100%;
        margin-top: 0;
        font-size: 13px;
        letter-spacing: normal;
        text-align: left;
    }

    .about-copy p:first-child,
    .about-copy p:nth-child(2),
    .about-copy p:nth-child(3) {
        width: 100%;
        text-align: left;
    }

    .about-copy p:first-child,
    .about-copy p:nth-child(2) {
        margin-bottom: 18px;
    }

    .about-design-break {
        display: none;
    }

    .about-logo {
        grid-column: 1;
        justify-items: center;
        margin-top: 0;
    }

    .about-logo img {
        width: 145px;
        height: auto;
    }

    .training {
        padding: 75px 20px 55px;
    }

    .training-grid {
        display: flex;
        flex-direction: column;
        height: auto;
        overflow: hidden;
        background: var(--pale-blue);
    }

    .training-grid::before,
    .training-lead::before {
        display: none;
    }

    .training-lead {
        display: block;
        width: 100%;
        height: auto;
        padding: 38px 24px;
        background: var(--pale-blue);
    }

    .training-lead h2 {
        width: 100%;
        margin: 0 0 20px;
        font-size: 23px;
        letter-spacing: normal;
        text-align: left;
    }

    .training-lead .short-line {
        width: 165px;
        height: 10px;
        margin: 0 0 35px;
    }

    .training-lead p,
    .training-lead p:first-of-type,
    .training-lead p:nth-of-type(2) {
        width: 100%;
        margin: 0;
        font-size: 13px;
    }

    .training-lead p:nth-of-type(2) {
        margin-top: 18px;
    }

    .training-design-break {
        display: none;
    }

    .training-photo {
        width: 100%;
        height: auto;
        margin: 0;
        overflow: hidden;
        box-shadow: none;
    }

    .training-photo img {
        aspect-ratio: 1.497 / 1;
        height: auto;
        object-fit: cover;
    }

    .training-photo::after {
        width: 100%;
        height: 100%;
        margin: 0;
    }

    .training-detail {
        width: 100%;
        margin: 28px 0 0;
        padding-inline: 8px;
        font-size: 13px;
    }

    .training-detail strong {
        letter-spacing: normal;
    }

    .training-promise {
        grid-template-columns: 1fr;
        width: 100%;
        height: auto;
        margin: 25px 0 0;
        padding: 0;
        gap: 8px;
        border-radius: 0;
    }

    .training-promise > strong {
        grid-column: 1;
        min-height: 55px;
        padding: 14px;
        font-size: 15px;
    }

    .training-logo {
        grid-column: 1;
        min-height: 55px;
    }

    .training-logo img {
        display: block;
        width: 128px;
        height: 43.5px;
    }

    .training-contact {
        grid-column: 1;
        grid-template-rows: repeat(2, auto);
        width: 100%;
        height: auto;
        padding: 8px 0;
        gap: 7px;
        border-bottom-width: 3px;
        transform: none;
    }

    .training-contact a {
        grid-area: auto;
        margin: 0;
        font-size: 12px;
    }

    .training-phone {
        grid-template-columns: 12px auto;
        gap: 9px;
    }

    .training-mail {
        grid-template-columns: 22px auto;
        gap: 7px;
    }

    .training-phone img {
        width: 12px;
        height: 15px;
    }

    .training-mail img {
        width: 22px;
        height: 15px;
    }

    .training-contact a > span {
        margin-top: 1px;
    }

    .credibility {
        min-height: 330px;
        background-size: 520px auto;
    }

    .results {
        background: #f4f4f4;
    }

    .results-grid {
        grid-template-columns: 1fr;
    }

    .stats-grid {
        max-width: 540px;
        margin-inline: auto;
    }

    .results-copy {
        max-width: 540px;
        margin-inline: auto;
    }

    .references {
        padding-top: 75px;
    }

    .references-grid {
        grid-template-columns: 1fr;
    }

    .references-copy {
        max-width: 430px;
    }

    .references-copy h2 {
        margin-bottom: 24px;
    }

    .experience {
        padding-top: 85px;
        background-size: 550px auto;
    }

    .experience h2 {
        flex-wrap: wrap;
        gap: 8px 20px;
        margin-bottom: 48px;
        font-size: 24px;
    }

    .offer-grid {
        grid-template-columns: 1fr;
        gap: 55px;
    }

    .offer-copy {
        padding: 0;
    }
}

@media (max-width: 470px) {
    .section-pad {
        padding-inline: 14px;
    }

    .header-contact {
        flex-wrap: wrap;
        gap: 3px 20px;
    }

    .hero-visual {
        aspect-ratio: 1.35 / 1;
        background-position: 51% top;
    }

    .hero-card {
        grid-template-columns: 105px 1fr;
        width: calc(100% - 16px);
    }

    .hero-person {
        align-items: flex-end;
    }

    .hero-person img {
        width: 108px;
    }

    .hero-message-top h2 {
        font-size: 17px;
    }

    .hero-message-bottom {
        font-size: 12px;
    }

    .course-grid {
        gap: 10px;
    }

    .course-card {
        min-height: 180px;
        padding-inline: 9px;
    }

    .course-card h3 {
        font-size: 11px;
    }

    .stats-grid {
        gap: 6px;
    }

    .stat-card {
        grid-template-columns: 1fr;
        min-height: 112px;
        text-align: center;
    }

    .stat-card strong {
        font-size: 31px;
    }

    .contact-card {
        padding-inline: 18px;
    }

    .contact-card div {
        flex-direction: column;
        gap: 8px;
    }

    .footer-main {
        min-height: 260px;
    }
}

/* Complete mobile composition */

@media (max-width: 780px) {
    html {
        scroll-padding-top: 20px;
    }

    body {
        font-size: 14px;
        line-height: 1.42;
    }

    .section-pad {
        padding-inline: clamp(16px, 4.6vw, 28px);
    }

    .content-wide {
        width: 100%;
    }

    .site-header {
        height: auto;
        overflow: visible;
    }

    .header-inner {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: auto auto auto;
        width: 100%;
        height: auto;
        padding: 9px 16px 12px;
        gap: 10px 16px;
        align-items: center;
    }

    .header-rule {
        display: none;
    }

    .header-contact {
        display: flex;
        grid-column: 1 / -1;
        grid-row: 1;
        width: 100%;
        margin: 0;
        justify-content: space-between;
        gap: 8px 16px;
        font-size: clamp(9px, 2.6vw, 11px);
        line-height: 1.2;
    }

    .contact-link {
        align-items: center;
    }

    .contact-link:first-child,
    .contact-link:last-child {
        gap: 7px;
    }

    .contact-link > span:last-child {
        margin-top: 0;
    }

    .phone-icon {
        width: 11px;
        height: 14px;
    }

    .mail-icon {
        width: 20px;
        height: 14px;
    }

    .brand {
        grid-column: 1;
        grid-row: 2;
        align-self: center;
        justify-self: start;
        width: clamp(172px, 50vw, 210px);
        height: auto;
        overflow: visible;
        border-radius: 0;
        background: transparent;
    }

    .brand img {
        width: 100%;
        height: auto;
        margin: 0;
        object-fit: contain;
    }

    .menu-toggle {
        display: inline-flex;
        grid-column: 2;
        grid-row: 2;
        min-width: 48px;
        min-height: 42px;
        padding: 8px 10px;
        justify-content: center;
        border: 1px solid rgba(46, 65, 83, 0.18);
        border-radius: 10px;
        color: var(--navy);
        background: var(--white);
        font-size: 11px;
        font-weight: 700;
        line-height: 1;
    }

    .menu-bars {
        font-size: 20px;
        line-height: 1;
    }

    .primary-nav {
        display: none;
        grid-column: 1 / -1;
        grid-row: 3;
        width: 100%;
        margin: 0;
        padding: 8px;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        border-radius: 12px;
        color: var(--white);
        background: var(--navy);
        font-size: 13px;
        line-height: 1.2;
        white-space: normal;
    }

    .primary-nav.is-open {
        display: flex;
    }

    .primary-nav a {
        padding: 11px 14px;
        text-align: center;
        border-bottom: 1px solid rgba(255, 255, 255, 0.13);
    }

    .primary-nav a:last-child {
        border-bottom: 0;
    }

    .hero {
        padding: 0 0 48px;
        background-position: center top;
        background-size: auto clamp(245px, 69vw, 300px);
    }

    .hero-visual {
        height: clamp(245px, 69vw, 300px);
        aspect-ratio: auto;
    }

    .hero-title {
        max-width: calc(100% - 32px);
        margin: 32px 16px 0;
        transform: none;
        font-size: clamp(28px, 8.5vw, 38px);
        line-height: 1.06;
        text-wrap: balance;
    }

    .hero-card {
        grid-template-columns: clamp(108px, 30vw, 145px) minmax(0, 1fr);
        width: calc(100% - 28px);
        min-height: 214px;
        margin-top: clamp(205px, 58vw, 248px);
        transform: none;
    }

    .hero-person {
        display: flex;
        height: 214px;
        overflow: visible;
        align-items: flex-end;
        justify-content: center;
        background: none;
    }

    .hero-person img {
        width: clamp(116px, 31.5vw, 148px);
        margin: 0;
    }

    .hero-message {
        grid-column: 1 / -1;
        grid-template-rows: 116px 62px;
        height: 178px;
        margin-top: 25px;
        overflow: hidden;
        border-radius: 18px;
        background: transparent;
    }

    .hero-message-top {
        grid-row: 1;
        min-height: 116px;
        padding: 14px 12px 12px clamp(112px, 31vw, 150px);
        background: var(--navy);
    }

    .hero-message-top p {
        margin-bottom: 8px;
        transform: none;
        font-size: clamp(12px, 3.4vw, 15px);
        line-height: 1.25;
    }

    .hero-message-top h2 {
        gap: 8px;
        transform: none;
        font-size: clamp(18px, 5.3vw, 24px);
        line-height: 1.08;
        text-align: left;
    }

    .hero-message-top h2 span {
        width: 8px;
        height: 38px;
        flex: 0 0 auto;
    }

    .hero-message-bottom {
        grid-row: 2;
        min-height: 62px;
        margin: 0 0 0 clamp(98px, 27vw, 130px);
        padding: 10px 12px 10px 18px;
        border-radius: 0 0 18px 0;
        font-size: clamp(12px, 3.5vw, 15px);
        line-height: 1.2;
    }

    .intro {
        padding-top: 34px;
        padding-bottom: 64px;
    }

    .narrow-copy > p:first-child,
    .intro-summary {
        width: 100%;
        max-width: 600px;
        transform: none;
        font-size: 14px;
        line-height: 1.35;
    }

    .narrow-copy > p:first-child {
        margin-bottom: 28px;
    }

    .service-list {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        max-width: 600px;
        margin: 0 auto 38px;
        transform: none;
        gap: 18px 12px;
        font-size: 13px;
    }

    .service-list li {
        justify-content: center;
        gap: 8px;
        white-space: normal;
        text-align: center;
    }

    .service-list li:last-child {
        grid-column: 1 / -1;
    }

    .service-list li::before {
        width: 20px;
        height: 20px;
    }

    .section-heading-line {
        grid-template-columns: 1fr auto 1fr;
        gap: 10px;
        margin-bottom: 28px;
    }

    .section-heading-line h2 {
        font-size: 13px;
    }

    .section-heading-line span {
        height: 2px;
    }

    .courses {
        padding-bottom: 72px;
    }

    .course-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .course-card {
        grid-template-rows: auto 1fr 20px;
        min-height: 192px;
        padding: 11px 9px 9px;
        border-radius: 16px;
    }

    .course-card img {
        width: min(105px, 76%);
    }

    .course-card h3 {
        margin-top: 27px;
        font-size: 12px;
    }

    .course-card a {
        grid-template-columns: auto 42px;
        gap: 6px;
        font-size: 9px;
    }

    .course-arrow {
        width: 42px;
        height: 18px;
    }

    .about {
        height: auto;
        min-height: 0;
        padding: 48px 18px 64px;
    }

    .about-backdrop {
        height: 100%;
    }

    .about-grid {
        grid-template-columns: 1fr;
        width: 100%;
        height: auto;
        gap: 28px;
    }

    .about-image,
    .about-copy,
    .about-logo {
        grid-column: 1;
        width: 100%;
        margin: 0;
    }

    .about-image {
        justify-items: center;
    }

    .about-image img {
        width: min(290px, 86vw);
        max-width: 100%;
        margin: 0;
    }

    .about-copy {
        font-size: 14px;
        line-height: 1.35;
        letter-spacing: normal;
    }

    .about-copy p:first-child,
    .about-copy p:nth-child(2),
    .about-copy p:nth-child(3) {
        width: 100%;
        text-align: left;
        text-align-last: auto;
    }

    .about-copy p:first-child,
    .about-copy p:nth-child(2) {
        margin-bottom: 20px;
    }

    .about-design-break {
        display: none;
    }

    .about-logo {
        justify-items: center;
    }

    .about-logo img {
        width: 170px;
        height: auto;
    }

    .training {
        padding: 64px 16px 56px;
    }

    .training > .content-wide {
        width: 100%;
    }

    .training-grid {
        display: flex;
        height: auto;
        flex-direction: column;
        overflow: hidden;
        background: var(--pale-blue);
    }

    .training-grid::before,
    .training-lead::before {
        display: none;
    }

    .training-lead {
        display: block;
        width: 100%;
        height: auto;
        padding: 34px 24px;
    }

    .training-lead h2 {
        width: 100%;
        margin: 0 0 20px;
        font-size: clamp(24px, 6.4vw, 30px);
        line-height: 1.18;
    }

    .training-lead .short-line {
        width: 48%;
        height: 8px;
        margin: 0 0 34px;
    }

    .training-lead p,
    .training-lead p:first-of-type,
    .training-lead p:nth-of-type(2) {
        width: 100%;
        margin: 0;
        font-size: 14px;
        line-height: 1.35;
    }

    .training-lead p:nth-of-type(2) {
        margin-top: 20px;
    }

    .training-design-break {
        display: none;
    }

    .training-photo {
        width: 100%;
        height: auto;
        margin: 0;
        overflow: hidden;
    }

    .training-photo img {
        width: 100%;
        height: auto;
        aspect-ratio: 1.497 / 1;
        object-fit: cover;
    }

    .training-photo::after {
        width: 100%;
        height: 100%;
        margin: 0;
    }

    .training-detail {
        width: 100%;
        margin: 28px 0 0;
        padding-inline: 8px;
        font-size: 14px;
        line-height: 1.35;
    }

    .training-detail p:first-child {
        margin-bottom: 18px;
    }

    .training-promise {
        grid-template-columns: 1fr;
        width: 100%;
        height: auto;
        margin: 28px 0 0;
        gap: 8px;
    }

    .training-promise > strong {
        grid-column: 1;
        min-height: 62px;
        padding: 14px;
        font-size: 16px;
    }

    .training-logo {
        grid-column: 1;
        min-height: 62px;
    }

    .training-logo img {
        width: 145px;
        height: auto;
    }

    .training-contact {
        grid-column: 1;
        grid-template-rows: repeat(2, auto);
        width: 100%;
        height: auto;
        padding: 11px 4px 13px;
        gap: 8px;
        border-bottom-width: 3px;
        transform: none;
    }

    .training-contact a {
        display: grid;
        grid-area: auto;
        margin: 0;
        font-size: 12px;
    }

    .training-phone {
        grid-template-columns: 12px auto;
        gap: 9px;
    }

    .training-mail {
        grid-template-columns: 22px auto;
        gap: 7px;
    }

    .training-phone img {
        width: 12px;
        height: 15px;
    }

    .training-mail img {
        width: 22px;
        height: 15px;
    }

    .training-contact a > span {
        margin-top: 1px;
    }

    .credibility {
        height: 230px;
        min-height: 0;
        margin-top: 0;
        padding: 24px;
        place-items: center;
        background-position: center top;
        background-size: 520px auto;
    }

    .credibility p {
        margin: 0;
        justify-self: center;
        align-self: center;
        font-size: 13px;
        text-align: center;
    }

    .results {
        height: auto;
        min-height: 0;
        margin-top: 0;
        padding: 44px 16px 58px;
        background: #f4f4f4;
    }

    .results::before {
        display: none;
    }

    .results-grid {
        display: flex;
        width: 100%;
        flex-direction: column;
        gap: 38px;
    }

    .stats-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: repeat(4, auto);
        width: 100%;
        height: auto;
        max-width: 560px;
        margin: 0 auto;
        gap: 10px;
    }

    .stats-grid .stat-card {
        grid-row: auto;
        grid-template-columns: 38% 62%;
        grid-template-rows: 1fr;
        width: 100%;
        height: 116px;
        min-height: 0;
        border-radius: 12px;
    }

    .stats-grid .stat-card strong {
        grid-area: 1 / 1;
        align-self: center;
        justify-self: center;
        margin: 0;
        font-size: clamp(29px, 9vw, 42px);
    }

    .stats-grid .stat-card span {
        grid-area: 1 / 2;
        align-self: center;
        justify-self: stretch;
        width: auto;
        margin: 0;
        padding: 0 7px 0 2px;
        font-size: clamp(11px, 3.1vw, 15px);
        line-height: 1.18;
        white-space: normal;
    }

    .stats-grid .stat-card small {
        margin-top: 6px;
        font-size: clamp(9px, 2.6vw, 12px);
        line-height: 1.2;
    }

    .results-copy {
        display: flex;
        width: 100%;
        height: auto;
        max-width: 560px;
        margin: 0 auto;
        flex-direction: column;
    }

    .instructors-title {
        display: grid;
        grid-template-columns: 58px auto 54px minmax(0, 1fr);
        width: 100%;
        height: auto;
        margin: 0 0 28px;
        align-items: center;
        gap: 8px;
    }

    .instructors-title > img:first-child {
        grid-area: 1 / 1;
        width: 54px;
        height: auto;
        margin: 0;
    }

    .instructors-circle {
        grid-area: 1 / 3;
        width: 54px;
        height: 62px;
        margin: 0;
    }

    .instructors-title h2 {
        display: contents;
        width: auto;
        height: auto;
        font-size: 16px;
    }

    .instructors-title .instructors-prefix {
        grid-area: 1 / 2;
        margin: 0;
        align-self: center;
        justify-self: start;
    }

    .instructors-title h2 > strong {
        grid-area: 1 / 3;
        margin: 0;
        align-self: center;
        justify-self: center;
        font-size: 30px;
        z-index: 1;
    }

    .instructors-title .instructors-suffix {
        grid-area: 1 / 4;
        margin: 0;
        align-self: center;
        justify-self: start;
    }

    .results-lead,
    .results-copy > p:not(.results-lead),
    .results-copy ul {
        width: 100%;
        margin: 0;
        font-size: 14px;
        line-height: 1.42;
    }

    .results-lead {
        order: 2;
        margin-bottom: 18px;
        font-size: 18px;
        line-height: 1.35;
    }

    .results-arrow {
        order: 3;
        width: 92px;
        height: auto;
        margin: 0 0 20px;
    }

    .results-copy > p:not(.results-lead) {
        order: 4;
        margin-bottom: 14px;
    }

    .results-copy ul {
        order: 5;
        gap: 5px;
        padding: 0;
        font-weight: 700;
    }

    .references {
        height: auto;
        min-height: 0;
        padding: 64px 16px;
    }

    .references-grid {
        display: flex;
        width: 100%;
        height: auto;
        flex-direction: column;
    }

    .references-copy {
        display: flex;
        width: 100%;
        height: auto;
        max-width: 560px;
        margin: 0 auto;
        flex-direction: column;
    }

    .references-copy h2,
    .references-copy p,
    .copy-arrow {
        width: 100%;
        margin: 0;
    }

    .references-copy h2 {
        margin-bottom: 22px;
        font-size: 26px;
        line-height: 1.15;
    }

    .references-copy p {
        font-size: 14px;
        line-height: 1.4;
    }

    .copy-arrow {
        width: 52px;
        height: auto;
        margin: 16px 0 0 auto;
    }

    .references-visual {
        width: 100%;
        height: auto;
        margin: 36px 0 0;
        object-fit: contain;
    }

    .experience {
        height: auto;
        min-height: 0;
        padding: 64px 18px 52px;
        overflow: hidden;
    }

    .experience::before {
        width: 100%;
        height: 100%;
        margin: 0;
        background-position: center bottom;
        background-size: auto 100%;
        opacity: 0.85;
    }

    .experience-inner {
        display: flex;
        width: 100%;
        height: auto;
        flex-direction: column;
        align-items: center;
    }

    .experience-logo,
    .experience h2,
    .experience-inner > p,
    .experience hr {
        grid-area: auto;
        align-self: auto;
        justify-self: auto;
    }

    .experience-logo {
        width: 88px;
        height: auto;
        margin: 0;
    }

    .experience h2 {
        display: flex;
        width: 100%;
        height: auto;
        margin: 22px 0 36px;
        flex-wrap: wrap;
        justify-content: center;
        gap: 4px 10px;
        font-size: clamp(25px, 7vw, 32px);
        line-height: 1.1;
    }

    .experience h2 > span,
    .experience h2 > b,
    .experience h2 > strong {
        grid-area: auto;
        margin: 0;
        align-self: auto;
        justify-self: auto;
    }

    .experience .experience-inner > p:not(.experience-callout) {
        width: 100%;
        max-width: 650px;
        margin: 0;
        font-size: 14px;
        line-height: 1.42;
    }

    .experience hr,
    .experience hr:nth-of-type(1),
    .experience hr:nth-of-type(2),
    .experience hr:nth-of-type(3) {
        width: 110px;
        height: 2px;
        margin: 18px 0;
    }

    .experience-callout {
        width: 100%;
        height: auto;
        margin: 34px 0 0;
        padding: 19px 18px;
        border-radius: 20px;
        font-size: 14px;
        line-height: 1.4;
    }

    .offer {
        height: auto;
        min-height: 0;
        padding: 58px 16px 52px;
    }

    .offer-grid {
        display: flex;
        width: 100%;
        height: auto;
        flex-direction: column;
        gap: 44px;
    }

    .offer-copy {
        display: block;
        order: 1;
        width: 100%;
        height: auto;
    }

    .offer-copy h2,
    .offer-copy > p,
    .offer-list {
        width: 100%;
        margin: 0;
    }

    .offer-copy h2 {
        font-size: clamp(24px, 6.5vw, 30px);
        line-height: 1.18;
    }

    .offer-copy > p {
        margin-top: 18px;
        font-size: 14px;
        line-height: 1.4;
    }

    .offer-list {
        display: grid;
        margin-top: 28px;
        gap: 14px;
        font-size: 14px;
        line-height: 1.35;
    }

    .offer-list li {
        grid-template-columns: 22px 1fr;
        gap: 10px;
    }

    .offer-list li::before {
        width: 22px;
        height: 22px;
    }

    .offer-visual {
        display: flex;
        order: 2;
        width: 100%;
        height: auto;
        flex-direction: column;
        align-items: center;
    }

    .offer-visual > img {
        width: min(100%, 430px);
        height: auto;
        margin: 0;
    }

    .contact-card {
        display: block;
        width: 100%;
        height: auto;
        margin: -4px 0 0;
        padding: 22px 20px;
        border-radius: 18px;
    }

    .contact-card h2 {
        width: 100%;
        margin: 0;
        font-size: clamp(20px, 5.5vw, 25px);
        line-height: 1.2;
    }

    .contact-card div {
        display: flex;
        width: 100%;
        margin: 20px 0 0;
        flex-direction: column;
        gap: 12px;
        font-size: 13px;
        white-space: normal;
    }

    .contact-card a:first-child,
    .contact-card a:last-child {
        grid-template-columns: 22px 1fr;
        gap: 10px;
    }

    .contact-card a:first-child::before {
        width: 16px;
        height: 18px;
    }

    .contact-card a:last-child::before {
        width: 22px;
        height: 16px;
    }

    .form-button {
        width: min(230px, 100%);
        height: 48px;
        margin: 14px 0 0;
        border-radius: 10px;
        font-size: 13px;
    }

    .site-footer {
        height: 86px;
        min-height: 0;
    }

    .footer-main {
        height: 100%;
        min-height: 0;
        background-size: 560px auto;
    }
}

@media (max-width: 470px) {
    .section-pad {
        padding-inline: 16px;
    }

    .header-inner {
        padding-inline: 12px;
        gap: 9px 10px;
    }

    .header-contact {
        gap: 7px 10px;
    }

    .brand {
        width: min(185px, 57vw);
    }

    .menu-toggle > span:first-child {
        display: none;
    }

    .hero-title {
        margin-top: 28px;
        font-size: clamp(27px, 8.4vw, 34px);
    }

    .hero-card {
        width: calc(100% - 20px);
    }

    .hero-message-top {
        padding-right: 10px;
    }

    .course-grid {
        gap: 10px;
    }

    .course-card {
        min-height: 186px;
    }

    .training {
        padding-inline: 14px;
    }

    .training-lead {
        padding: 30px 22px;
    }

    .stats-grid .stat-card {
        height: 112px;
    }

    .instructors-title {
        grid-template-columns: 48px auto 48px minmax(0, 1fr);
        gap: 6px;
    }

    .instructors-title > img:first-child {
        width: 46px;
    }

    .instructors-circle {
        width: 48px;
        height: 56px;
    }

    .instructors-title h2 {
        font-size: 14px;
    }

    .instructors-title h2 > strong {
        font-size: 27px;
    }

    .experience {
        padding-inline: 16px;
    }

    .offer {
        padding-inline: 14px;
    }

    .site-footer,
    .footer-main {
        height: 78px;
        min-height: 0;
    }
}

@media (max-width: 350px) {
    .header-contact {
        flex-wrap: wrap;
        justify-content: center;
    }

    .course-grid {
        grid-template-columns: 1fr;
    }

    .course-card {
        min-height: 210px;
    }

    .stats-grid {
        grid-template-columns: 1fr;
    }

    .stats-grid .stat-card {
        height: 104px;
    }
}

@media (max-width: 780px) {
    .contact-card a::before {
        filter: brightness(0) invert(1);
    }
}

@media (min-width: 600px) and (max-width: 780px) {
    .hero {
        background-size: cover;
    }
}