/* Project Photo - Public Photography Service Page */

.public-service-page {
    position: relative;
    color: inherit;
}


/* Hero */

.public-service-hero {
    position: relative;
    min-height: 62vh;
    overflow: hidden;
    background: #111;
}

.public-service-hero-images,
.public-service-hero-slide,
.public-service-hero-overlay {
    position: absolute;
    inset: 0;
}

.public-service-hero-slide {
    opacity: 0;
    background-position: center;
    background-size: cover;
    transition: opacity 1.2s ease;
}

.public-service-hero-slide.is-active {
    opacity: 1;
}

.public-service-hero-overlay {
    background:
        linear-gradient(
            to top,
            rgba(8, 8, 8, 0.86),
            rgba(8, 8, 8, 0.16)
        );
}

.public-service-hero-content {
    position: relative;
    z-index: 2;

    display: flex;
    min-height: 62vh;
    flex-direction: column;
    justify-content: flex-end;

    box-sizing: border-box;
    width: min(100%, 1500px);
    margin: 0 auto;
    padding: 56px 6vw;
}

.public-service-hero-content h1 {
    margin: 6px 0 0;
    color: #fff;

    font-size:
        clamp(
            2.5rem,
            7vw,
            5.8rem
        );

    line-height: 0.96;
}

.public-service-hero .public-section-kicker {
    color: rgba(255, 255, 255, 0.78);
}


/* Introduction */

.public-service-introduction {
    padding:
        clamp(48px, 7vw, 96px)
        6vw
        clamp(38px, 6vw, 78px);
}

.public-service-introduction-inner {
    width: min(100%, 1040px);
    margin: 0 auto;
}

.public-service-description {
    max-width: 900px;
}

.public-service-description p {
    margin: 0 0 1.45em;
    color: inherit;

    font-size:
        clamp(
            1.05rem,
            1.7vw,
            1.3rem
        );

    line-height: 1.75;
}

.public-service-description p:last-child {
    margin-bottom: 0;
}

.public-service-client-cta {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    margin-top: 32px;

    color: inherit;
    font-weight: 600;
    text-decoration: none;
}

.public-service-client-cta:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.public-service-client-cta svg {
    width: 18px;
    height: 18px;
}


/* Additional Galleries */

.public-service-gallery-section {
    width: min(88%, 1500px);
    margin: 0 auto;

    padding:
        20px
        0
        clamp(60px, 8vw, 110px);
}

.public-service-gallery-heading {
    margin-bottom: 32px;
}

.public-service-gallery-heading h2 {
    margin: 6px 0 0;
    color: inherit;

    font-size:
        clamp(
            2rem,
            4vw,
            3.6rem
        );

    line-height: 1.05;
}

.public-service-gallery-grid {
    display: grid;
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap:
        clamp(
            28px,
            4vw,
            58px
        );
}

.public-service-gallery-card {
    display: block;
    min-width: 0;

    color: inherit;
    text-decoration: none;
}

.public-service-gallery-cover {
    position: relative;

    aspect-ratio: 16 / 10;

    overflow: hidden;
    border-radius: 14px;

    background: rgba(127, 127, 127, 0.12);
}

.public-service-gallery-cover img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.45s ease;
}

.public-service-gallery-card:hover
.public-service-gallery-cover img {
    transform: scale(1.035);
}

.public-service-gallery-placeholder {
    display: grid;

    width: 100%;
    height: 100%;

    place-items: center;
    opacity: 0.45;
}

.public-service-gallery-placeholder svg {
    width: 38px;
    height: 38px;
}

.public-service-gallery-lock {
    position: absolute;
    top: 14px;
    right: 14px;

    display: grid;

    width: 38px;
    height: 38px;

    place-items: center;

    border-radius: 50%;

    background: rgba(14, 14, 14, 0.76);
    color: #fff;

    backdrop-filter: blur(8px);
}

.public-service-gallery-lock svg {
    width: 18px;
    height: 18px;
}

.public-service-gallery-copy {
    padding: 18px 2px 0;
}

.public-service-gallery-copy h3 {
    margin: 0 0 8px;
    color: inherit;

    font-size:
        clamp(
            1.35rem,
            2vw,
            1.7rem
        );
}

.public-service-gallery-copy p {
    max-width: 60ch;

    margin: 0 0 14px;

    color: inherit;
    opacity: 0.72;

    line-height: 1.6;
}

.public-service-gallery-action {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-top: 5px;

    color: inherit;

    font-size: 0.9rem;
    font-weight: 600;
}

.public-service-gallery-action svg {
    width: 16px;
    height: 16px;

    transition: transform 0.25s ease;
}

.public-service-gallery-card:hover
.public-service-gallery-action svg {
    transform: translateX(4px);
}


/* Responsive */

@media (max-width: 760px) {

    .public-service-hero,
    .public-service-hero-content {
        min-height: 54vh;
    }

    .public-service-hero-content {
        padding: 42px 22px;
    }

    .public-service-introduction {
        padding: 44px 22px 38px;
    }

    .public-service-gallery-section {
        width: auto;
        padding: 18px 22px 64px;
    }

    .public-service-gallery-grid {
        grid-template-columns: 1fr;
        gap: 38px;
    }

}


/* Reduced motion */

@media (prefers-reduced-motion: reduce) {

    .public-service-hero-slide,
    .public-service-gallery-cover img,
    .public-service-gallery-action svg {
        transition: none;
    }

}