.home-hero {
    position: relative;
    min-height: var(--sr-hero-height);
    display: grid;
    align-items: center;
    color: #fff;
    background:
        linear-gradient(var(--sr-hero-overlay), var(--sr-hero-overlay)),
        var(--sr-hero-image) center / cover;
}

.home-hero__content {
    position: relative;
    max-width: 860px;
    text-align: center;
}

.home-hero.is-under-header .home-hero__content {
    padding-top: var(--sr-header-min-height);
}

.home-hero__brand {
    display: block;
    margin-bottom: 16px;
    color: var(--sr-hero-badge-color);
    font-size: var(--sr-hero-badge-size);
    font-weight: var(--sr-hero-badge-weight);
    line-height: 1;
    letter-spacing: 0;
    min-height: 1em;
    position: relative;
    z-index: 1;
    letter-spacing: 6px;
}

.home-hero h1 {
    margin: 0 0 18px;
    color: var(--sr-hero-title-color);
    font-size: var(--sr-hero-title-size);
    font-weight: var(--sr-hero-title-weight);
    line-height: 1.02;
}

.home-hero p {
    max-width: 720px;
    margin: 0 auto;
    color: var(--sr-hero-text-color);
    font-size: var(--sr-hero-text-size);
    font-weight: var(--sr-hero-text-weight);
}

.home-hero__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
    margin-top: 34px;
}

.sr-button--hero-outline {
    color: var(--sr-hero-button-text);
    background: transparent;
    border: 1px solid var(--sr-hero-button-border);
    font-size: var(--sr-hero-button-size);
    font-weight: var(--sr-hero-button-weight);
    box-shadow: none;
}

.sr-button--hero-outline:hover {
    color: var(--sr-hero-button-text);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: none;
}

.home-hero__stats {
    display: grid;
    grid-template-columns: repeat(3, auto auto);
    justify-content: center;
    gap: 10px 14px;
    margin-top: 48px;
    align-items: center;
    color: #fff;
}

.home-hero__stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.home-hero__stat-icon svg {
    width: 23px;
    height: 23px;
}

.home-hero__stat-text {
    display: grid;
    gap: 2px;
    justify-items: start;
}

.home-hero__stats strong {
    color: #fff;
    font-size: 28px;
    line-height: 1;
}

.home-hero__stat-text span {
    color: rgba(255, 255, 255, 0.82);
    font-size: 14px;
}

.sr-experiences {
    margin-top: var(--sr-exp-margin-top);
    margin-bottom: var(--sr-exp-margin-bottom);
    background: var(--sr-exp-bg);
    padding-top: var(--sr-exp-padding-top);
    padding-bottom: var(--sr-exp-padding-bottom);
}

.sr-experiences__header {
    display: grid;
    grid-template-columns: max-content minmax(280px, 1fr);
    gap: var(--sr-exp-header-gap);
    align-items: end;
    margin-bottom: var(--sr-exp-header-margin-bottom);
}

.sr-experiences__label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    color: var(--sr-exp-label-color);
    font-size: var(--sr-exp-label-size);
    font-weight: var(--sr-exp-label-weight);
    letter-spacing: 1px;
    text-transform: uppercase;
}

.sr-experiences__label::before {
    content: "";
    width: 28px;
    height: 1px;
    background: currentColor;
    opacity: 0.6;
}

.sr-experiences__header h2 {
    margin: 0;
    color: var(--sr-exp-title-top);
    font-size: var(--sr-exp-title-size);
    font-weight: var(--sr-exp-title-weight);
    line-height: 1.08;
    letter-spacing: 0;
    white-space: nowrap;
}

.sr-experiences__header h2 span,
.sr-experiences__header h2 strong {
    display: inline;
}

.sr-experiences__header h2 span::after {
    content: " ";
}

.sr-experiences__header h2 span {
    color: var(--sr-exp-title-top);
}

.sr-experiences__header h2 strong {
    color: var(--sr-exp-title-bottom);
}

.sr-experiences__header p {
    max-width: 680px;
    margin: 0;
    color: var(--sr-exp-intro);
    font-size: var(--sr-exp-intro-size);
    font-weight: var(--sr-exp-intro-weight);
    line-height: 1.55;
}

.sr-experience-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
}

.sr-experience-card {
    display: grid;
    min-height: var(--sr-exp-card-min-height);
    align-content: start;
    gap: var(--sr-exp-card-gap);
    padding: var(--sr-exp-card-padding-y) var(--sr-exp-card-padding-x);
    border-bottom: 1px solid var(--sr-exp-border);
    border-left: 1px solid var(--sr-exp-border);
}

.sr-experience-card:nth-child(3n+1) {
    border-left: 0;
}

@media (min-width: 901px) {
    .sr-experience-card:nth-last-child(-n+3) {
        border-bottom: 0;
    }
}

.sr-experience-card__icon {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    color: var(--sr-exp-icon);
    background: transparent;
    border-radius: 0;
}

.sr-experience-card__icon svg {
    width: 25px;
    height: 25px;
}

.sr-experience-card h3 {
    margin: var(--sr-exp-card-title-margin-top) 0 0;
    color: var(--sr-exp-card-title);
    font-size: 17px;
    font-weight: 600;
    line-height: 1.12;
    text-transform: uppercase;
}

.sr-experience-card p {
    margin: var(--sr-exp-card-text-margin-top) 0 0;
    color: var(--sr-exp-card-text);
    font-size: 14px;
    font-weight: var(--sr-exp-card-text-weight);
    line-height: 1.55;
}

.sr-experience-card a {
    display: inline-flex;
    justify-self: end;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    color: var(--sr-exp-link);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 2px;
    text-transform: uppercase;
}
.sr-experience-card:nth-last-child(-n+3) {
    border-bottom: 0;
}
.sr-experience-card a svg {
    width: 16px;
    height: 16px;
}

.sr-yachts-showcase--home {
    margin-top: var(--sr-home-yachts-margin-top);
    margin-bottom: var(--sr-home-yachts-margin-bottom);
    padding-top: var(--sr-home-yachts-padding-top);
    padding-bottom: var(--sr-home-yachts-padding-bottom);
    background: var(--sr-home-yachts-bg);
}

.sr-yachts-showcase--portfolio {
    margin-top: var(--sr-portfolio-yachts-margin-top);
    margin-bottom: var(--sr-portfolio-yachts-margin-bottom);
    padding-top: var(--sr-portfolio-yachts-padding-top);
    padding-bottom: var(--sr-portfolio-yachts-padding-bottom);
    background: var(--sr-portfolio-yachts-bg);
}

.sr-yachts__header {
    display: grid;
    grid-template-columns: max-content minmax(280px, 1fr);
    gap: var(--sr-exp-header-gap);
    align-items: end;
    margin-bottom: 56px;
}

.sr-yachts__header span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    color: var(--sr-home-yachts-label-color);
    font-size: var(--sr-home-yachts-label-size);
    font-weight: var(--sr-home-yachts-label-weight);
    letter-spacing: 1px;
    text-transform: uppercase;
}

.sr-yachts__header span::before {
    content: "";
    width: 28px;
    height: 1px;
    background: currentColor;
    opacity: 0.6;
}

.sr-yachts__header h2 {
    margin: 0;
    color: var(--sr-home-yachts-title-color);
    font-size: var(--sr-home-yachts-title-size);
    font-weight: var(--sr-home-yachts-title-weight);
    line-height: 1.08;
    letter-spacing: 0;
    white-space: nowrap;
}

.sr-yachts__header--portfolio span {
    color: var(--sr-portfolio-yachts-label-color);
    font-size: var(--sr-portfolio-yachts-label-size);
    font-weight: var(--sr-portfolio-yachts-label-weight);
}

.sr-yachts__header--portfolio h1 {
    margin: 0;
    color: var(--sr-portfolio-yachts-title-color);
    font-size: var(--sr-portfolio-yachts-title-size);
    font-weight: var(--sr-portfolio-yachts-title-weight);
    line-height: 1.08;
    letter-spacing: 0;
    white-space: nowrap;
}

.sr-yachts__header--portfolio p {
    color: var(--sr-portfolio-yachts-desc-color);
    font-size: var(--sr-portfolio-yachts-desc-size);
    font-weight: var(--sr-portfolio-yachts-desc-weight);
}

.sr-yachts__header p {
    max-width: 680px;
    margin: 0;
    color: var(--sr-home-yachts-desc-color);
    font-size: var(--sr-home-yachts-desc-size);
    font-weight: var(--sr-home-yachts-desc-weight);
    line-height: 1.6;
}

.sr-tours-section {
    margin-top: var(--sr-tours-margin-top);
    margin-bottom: var(--sr-tours-margin-bottom);
    padding-top: var(--sr-tours-padding-top);
    padding-bottom: var(--sr-tours-padding-bottom);
    background: var(--sr-tours-bg);
}

.sr-features-section {
    margin-top: var(--sr-features-margin-top);
    margin-bottom: var(--sr-features-margin-bottom);
    padding-top: var(--sr-features-padding-top);
    padding-bottom: var(--sr-features-padding-bottom);
    background: var(--sr-features-bg);
}

.sr-tours__header,
.sr-features__header {
    display: grid;
    grid-template-columns: max-content minmax(280px, 1fr);
    gap: var(--sr-exp-header-gap);
    align-items: end;
    margin-bottom: 56px;
}

.sr-tours__label,
.sr-features__label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.sr-tours__label {
    color: var(--sr-tours-label-color);
    font-size: var(--sr-tours-label-size);
    font-weight: var(--sr-tours-label-weight);
}

.sr-features__label {
    color: var(--sr-features-label-color);
    font-size: var(--sr-features-label-size);
    font-weight: var(--sr-features-label-weight);
}

.sr-tours__label::before,
.sr-features__label::before {
    content: "";
    width: 28px;
    height: 1px;
    background: currentColor;
    opacity: 0.6;
}

.sr-tours__header h2,
.sr-features__header h2 {
    margin: 0;
    line-height: 1.08;
    letter-spacing: 0;
    white-space: nowrap;
}

.sr-tours__header h2 {
    color: var(--sr-tours-title-color);
    font-size: var(--sr-tours-title-size);
    font-weight: var(--sr-tours-title-weight);
}

.sr-features__header h2 {
    color: var(--sr-features-title-color);
    font-size: var(--sr-features-title-size);
    font-weight: var(--sr-features-title-weight);
}

.sr-tours__header p,
.sr-features__header p {
    max-width: 680px;
    margin: 0;
    line-height: 1.6;
}

.sr-tours__header p {
    color: var(--sr-tours-text-color);
    font-size: var(--sr-tours-text-size);
    font-weight: var(--sr-tours-text-weight);
}

.sr-features__header p {
    color: var(--sr-features-text-color);
    font-size: var(--sr-features-text-size);
    font-weight: var(--sr-features-text-weight);
}

.sr-tour-grid,
.sr-feature-grid {
    display: grid;
    gap: 0;
}

.sr-tour-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sr-feature-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sr-tour-card,
.sr-feature-card {
    display: grid;
    align-content: start;
    min-height: 250px;
    padding: 34px 28px;
}

.sr-tour-card {
    border-bottom: 1px solid var(--sr-border, #e4edf5);
    border-left: 1px solid var(--sr-border, #e4edf5);
}

.sr-feature-card {
    border-bottom: 1px solid var(--sr-features-border);
    border-left: 1px solid var(--sr-features-border);
}

.sr-tour-card:nth-child(4n+1),
.sr-feature-card:nth-child(4n+1) {
    border-left: 0;
}

.sr-tour-card:nth-last-child(-n+4),
.sr-feature-card:nth-last-child(-n+4) {
    border-bottom: 0;
}

.sr-tour-card__icon,
.sr-feature-card__icon {
    display: grid;
    width: 54px;
    height: 54px;
    place-items: center;
    margin-bottom: 30px;
}

.sr-tour-card__icon {
    color: var(--sr-tours-label-color);
}

.sr-feature-card__icon {
    color: var(--sr-features-icon-color);
}

.sr-tour-card__icon svg,
.sr-feature-card__icon svg {
    width: 28px;
    height: 28px;
}

.sr-tour-card h3,
.sr-feature-card h3 {
    margin: 0;
    font-size: var(--sr-features-card-title-size);
    font-weight: var(--sr-features-card-title-weight);
    line-height: 1.16;
    text-transform: uppercase;
}

.sr-tour-card h3 {
    color: var(--sr-tours-title-color);
}

.sr-feature-card h3 {
    color: var(--sr-features-card-title-color);
}

.sr-tour-card p,
.sr-feature-card p {
    margin: 18px 0 0;
    font-size: var(--sr-features-card-text-size);
    font-weight: var(--sr-features-card-text-weight);
    line-height: 1.58;
}

.sr-tour-card p {
    color: var(--sr-tours-text-color);
}

.sr-feature-card p {
    color: var(--sr-features-card-text-color);
}

.sr-tour-card a {
    display: inline-flex;
    justify-self: end;
    align-items: center;
    gap: 8px;
    margin-top: 28px;
    color: var(--sr-tours-label-color);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.sr-tour-card a svg {
    width: 16px;
    height: 16px;
}

.sr-tour-package-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sr-tours-grid-gap);
}

.sr-tour-package-card {
    display: grid;
    background: #fff;
}

.sr-tour-package-card__image {
    position: relative;
    display: flex;
    height: var(--sr-tours-image-height);
    align-items: flex-end;
    overflow: hidden;
    color: var(--sr-tours-card-title);
    background-image:
        linear-gradient(180deg, rgba(0, 0, 0, 0) 28%, var(--sr-tours-image-gradient) 100%),
        var(--sr-tour-card-image, linear-gradient(135deg, #dfeaf7, #9ab4d2));
    background-position: center;
    background-size: cover;
}

.sr-tour-package-card__image:hover {
    color: var(--sr-tours-card-title);
}

.sr-tour-package-card__badge {
    position: absolute;
    top: 24px;
    left: 24px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 8px 18px;
    color: var(--sr-tours-badge-text);
    background: var(--sr-tours-badge-bg-rgba);
    border: 1px solid var(--sr-tours-badge-border);
    border-radius: 5px;
    font-size: var(--sr-tours-badge-size);
    font-weight: var(--sr-tours-badge-weight);
    letter-spacing: 0;
    line-height: 1;
    text-transform: uppercase;
}

.sr-tour-package-card__content {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 18px;
    width: 100%;
    padding: 0 32px 32px;
}

.sr-tour-package-card__content strong {
    color: var(--sr-tours-card-title);
    font-size: var(--sr-tours-card-title-size);
    font-weight: var(--sr-tours-card-title-weight);
    line-height: 1.1;
    text-transform: uppercase;
}

.sr-tour-package-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    color: var(--sr-tours-card-meta);
    font-size: var(--sr-tours-card-meta-size);
    font-weight: var(--sr-tours-card-meta-weight);
}

.sr-tour-package-card__meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.sr-tour-package-card__meta svg {
    width: 18px;
    height: 18px;
}

.sr-tour-package-card__footer {
    display: flex;
    min-height: 92px;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 26px 0;
}

.sr-tour-package-card__route {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--sr-tours-route);
    font-size: var(--sr-tours-route-size);
    font-weight: var(--sr-tours-route-weight);
    line-height: 1.4;
}

.sr-tour-package-card__route svg {
    width: 19px;
    height: 19px;
    color: var(--sr-tours-badge-bg);
}

.sr-tour-package-card__button,
.sr-tour-custom-box a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    padding: 0 22px;
    border-radius: 5px;
    color: var(--sr-tours-button-text);
    background: var(--sr-tours-button-bg);
    font-size: var(--sr-tours-button-size);
    font-weight: var(--sr-tours-button-weight);
    letter-spacing: 1.8px;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.sr-tour-package-card__button:hover,
.sr-tour-custom-box a:hover {
    color: var(--sr-tours-button-text);
    filter: brightness(0.96);
}

.sr-tour-package-card__button svg,
.sr-tour-custom-box a svg {
    width: 16px;
    height: 16px;
}

.sr-tour-custom-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    justify-content: space-between;
    gap: 32px;
    margin-top: var(--sr-tours-grid-gap);
    padding: 54px 64px;
    background: var(--sr-tours-special-bg);
}

.sr-tour-custom-box__content {
    display: grid;
    max-width: 820px;
    gap: 14px;
}

.sr-tour-custom-box span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--sr-tours-special-label);
    font-size: var(--sr-tours-special-label-size);
    font-weight: var(--sr-tours-special-label-weight);
    letter-spacing: 4px;
    text-transform: uppercase;
}

.sr-tour-custom-box span::before {
    content: "";
    width: 28px;
    height: 1px;
    background: currentColor;
    opacity: 0.7;
}

.sr-tour-custom-box strong {
    color: var(--sr-tours-special-title);
    font-size: var(--sr-tours-special-title-size);
    font-weight: var(--sr-tours-special-title-weight);
    line-height: 1.18;
    text-transform: uppercase;
}

.sr-tour-custom-box p {
    max-width: 760px;
    margin: 0;
    color: var(--sr-tours-special-text);
    font-size: var(--sr-tours-special-text-size);
    font-weight: var(--sr-tours-special-text-weight);
    line-height: 1.65;
}

.sr-tour-custom-box a {
    align-self: end;
    color: var(--sr-tours-special-button-text);
    background: var(--sr-tours-special-button-bg);
    font-size: var(--sr-tours-special-button-size);
    font-weight: var(--sr-tours-special-button-weight);
}

.sr-tour-custom-box a:hover {
    color: var(--sr-tours-special-button-text);
}
