/* /////////////////////////////////////////////////////////////////// */
/* //////////////////////////// Single Portfolio Neonstyle ///////////////////////////////// */
/* /////////////////////////////////////////////////////////////////// */

:root {
    --portfolio-inner-padding: 18px;
    --portfolio-inner-border-radius: 10px;
    @media (min-width: 768px) {
        --portfolio-inner-padding: 30px;
    }
}

.single-portfolio-neonstyle h2 {
    font-size: 30px;
    margin-bottom: 15px;
}

/* Girl Header */

    .single-portfolio-neonstyle .girl-header {
        position: relative;
        width: 100%;
        height: var(--header-height);
    }


    .single-portfolio-neonstyle .single-portfolio-body {
        padding: var(--portfolio-inner-padding);
        background-color: var(--color-content-bg-alt);
        margin: 0 auto;
    }



    .single-portfolio-neonstyle .girl-header  .girl-header-bg {
        position: absolute;
        width: 100%;
        height: 100%;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }


    .single-portfolio-neonstyle .girl-header .girl-header-bg picture {
        display: block;
        width: 100%;
        height: 100%;
        line-height: 0;
    }


    .single-portfolio-neonstyle .girl-header .girl-header-bg picture img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        filter: grayscale(100%);
    }


/* single-portfolio-body-inner */

    .single-portfolio-body-inner {
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: var(--portfolio-inner-padding);
        @media (min-width: 768px) {
            grid-template-columns: 1fr 2fr;
            align-items: start;
        }
    }
    .single-portfolio-body-inner-left,
    .single-portfolio-body-inner-right {
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: var(--portfolio-inner-padding);
    }


/* Section girl-gallery */

    .single-portfolio-neonstyle section.girl-gallery .girl-photos {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: var(--portfolio-inner-padding);
        grid-template-areas: "img1 img1" "img2 img3" "img4 img5";
        @media (min-width: 768px) {
            grid-template-columns: 1fr 1fr 1fr;
            grid-template-areas: "img1 img2 img3";
        }
        @media (min-width: 1190px) {
            grid-template-columns: 1fr 1fr 1fr 1fr;
            grid-template-areas: "img1 img2 img3 img4";
        }
    }

    @media (max-width: 768px) {
        .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(n+6) {
            display: none;
        }
    }
    @media (min-width: 768px) and (max-width: 1190px) {
        .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(n+4) {
            display: none;
        }
    }
    @media (min-width: 1190px) {
        .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(n+5) {
            display: none;
        }
    }

    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a {
        position: relative;
    }

    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(1) {
        grid-area: img1;
    }
    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(2) {
        grid-area: img2;
    }
    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(3) {
        grid-area: img3;
    }
    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(4) {
        grid-area: img4;
    }
    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(5) {
        grid-area: img5;
    }


    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a picture {
        display: block;
        width: 100%;
        height: 100%;
        line-height: 0;
        overflow: hidden;
        border-radius: var(--portfolio-inner-border-radius);
    }

    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a picture img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        aspect-ratio: 2/3;
        border-radius: var(--portfolio-inner-border-radius);
        transition: transform 0.4s ease-in-out;
    }

    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a picture img:hover {
        transform: scale(1.1);
    }

    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a .girl-photos-numberbox {
        position: absolute;
        bottom: 5px;
        right: 5px;
        width: calc(100% - 10px);
        margin-right: 10px;
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        align-items: center;
        font-size: 17px;
        color: white;
    }


/* Section girl-contact */

    section.girl-contact {
        padding: var(--portfolio-inner-padding);
        border-radius: var(--portfolio-inner-border-radius);
        background-color: var(--color-content-bg);
        border: 1px solid var(--color-alt-content-secondary);
		margin-bottom: 20px;
        margin-top: 20px;
    }

a.ush_btn_2[href^="tel:"] {
  position: relative;
  padding-left: 40px !important;
}

a.ush_btn_2[href^="tel:"]::after {
  content: "";
  position: absolute;
  left: 25px;
  top: 50%;
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 2;
  background-color: var(--color-content-primary) !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.ush_btn_2 {
  min-width: 210px !important;
}


/* Section girl-bio */

    section.girl-bio {
        padding: var(--portfolio-inner-padding);
        border-radius: var(--portfolio-inner-border-radius);
        background-color: var(--color-content-bg);
        border: 1px solid var(--color-alt-content-secondary);
    }

    ul.s1xc-bio {
        margin: 0;
        padding: 0;
        display: grid;
        grid-gap: 5px;
        grid-template-columns: 1fr;
    }

    ul.s1xc-bio li {
        list-style: none;
        margin-bottom: 0;
        display: flex;
        gap: 5px;
        flex-direction: row;
        justify-content: space-between;
    }

    ul.s1xc-bio li span.label {
        font-size: 16px;
    }
    ul.s1xc-bio li span.value {
        text-align: right;
        font-size: 16px;
        font-weight: bold;
    }

/* Section girl-info */

    section.girl-info {
        padding: var(--portfolio-inner-padding);
        border-radius: var(--portfolio-inner-border-radius);
        background-color: var(--color-content-bg);
        border: 1px solid var(--color-alt-content-secondary);
    }

    .s1xc-available {
        background-color: var(--color-custom-available-bg);
        color: #fff;
        text-transform: uppercase;
        padding: 2px 10px;
        margin: 0;
        display: inline-block;
        border-radius: 50px;
		font-size: 18px;
		padding: 7px 20px;
 		border: 1px solid var(--color-custom-available-border);
 		box-shadow: 0 0 8px var(--color-custom-available-shadow);
    }

    .s1xc-available-next-week {
        background: var(--color-content-border);
        color: #fff;
        text-transform: uppercase;
        padding: 2px 10px;
        margin: 0;
        display: inline-block;
        border-radius: 2px;
    }

/* Section girl-description */

    section.girl-description {
        padding: var(--portfolio-inner-padding);
        border-radius: var(--portfolio-inner-border-radius);
        background-color: var(--color-content-bg);
        border: 1px solid var(--color-alt-content-secondary);
    }

    .s1xc-description p {
        font-size: 16px !important;
        line-height: 110% !important;
        margin-bottom: 0;
    }

/* Section girl-name */

    section.girl-name {
        margin: 10px auto 20px;
        position: relative;
    }

    h1.s1xc-portfoliogirl-name {
        margin: 0;
        padding: 0;
    }

	.name-status {
    display: flex;
    align-items: center;
    gap: 20px;
	}

	.name-status .s1xc-portfoliogirl-name {
    margin: 0;
	}

	.name-status .s1xc-available,
	.name-status .s1xc-available-next-week {
    margin: 0;
    flex-shrink: 0;
	}


@media (max-width: 700px) {

    .girl-name .name-status {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 15px;
    }

    .girl-name .s1xc-portfolio-girl-name {
        margin: 0;
        flex: 0 1 auto;
        max-width: 100%;
        line-height: 1.05;
    }

    .girl-name .s1xc-available {
        position: static !important;
        flex: 0 0 auto;
        margin: 0 !important;
        white-space: nowrap;
    }
}

/* Section girl-prices */

    section.girl-prices {
        padding: var(--portfolio-inner-padding);
        border-radius: var(--portfolio-inner-border-radius);
        background-color: var(--color-content-bg);
        border: 1px solid var(--color-alt-content-secondary);
    }

    div.s1xc-prices {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 5px;
    }

    div.s1xc-prices .price-item {
        display: grid;
        grid-gap: 5px;
        padding: 10px;
        border-radius: var(--portfolio-inner-border-radius);
        background-color: rgb(0 0 0 / 10%);
        grid-template-areas: "time" "text" "price";
        grid-template-columns: 1fr;
    }

    div.s1xc-prices .price-item .time {
        grid-area: time;
        font-size: 16px;
        font-weight: bold;
        line-height: 100%;
    }
    div.s1xc-prices .price-item .price {
        grid-area: price;
        font-size: 17px;
        font-weight: bold;
        white-space: nowrap;
        align-self: center;
        color: var(--color-content-heading,inherit);
        line-height: 100%;
        margin-top: 6px;
        text-align: right;
    }
    div.s1xc-prices .price-item .text {
        grid-area: text;
        line-height: 110%;
        font-size: 16px;
    }

/* Section girl-service */

    section.girl-service {
        padding: var(--portfolio-inner-padding);
        border-radius: var(--portfolio-inner-border-radius);
        background-color: var(--color-content-bg);
        border: 1px solid var(--color-alt-content-secondary);
    }

    ul.s1xc-services {
        margin: 0;
        padding: 0;
        display: grid;
        grid-gap: 15px;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        @media (min-width: 768px) {
            grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        }
    }

    ul.s1xc-services li {

        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none; /* Non-prefixed version, currently
                              supported by Chrome, Edge, Opera and Firefox */

        list-style: none;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        font-size: 15px;

        margin: 0;
        padding: 10px;
        border-radius: var(--portfolio-inner-border-radius);
        color: var(--color-content-text);
        background-color: var(--color-custom-service-box);
        border: 1px solid var(--color-alt-content-secondary);
        transition: filter 0.2s ease-in-out;
        filter: grayscale(30%);
    }

    ul.s1xc-services li:hover {
        filter: none;
    }

    ul.s1xc-services li:before {
        flex-shrink: 0;
        content: "\f004";
        width: 30px;
        height: 30px;
        padding: 0 3px 0 0px;
        margin-right: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-family: "Font Awesome 5 Free";
        color: var(--color-alt-content-text);
        background-color: var(--color-alt-content-secondary);
        font-size: 15px;
        border-radius: 50px;
    }

    ul.s1xc-services li .name {
        flex-grow: 1;
        line-height: 110%;
        align-self: center;
        height: fit-content;
    }

    ul.s1xc-services li .name span.extra-cost {
        font-size: 12px;
        font-weight: bold;
        display: inline-block;
    }

    ul.s1xc-services li i {
        margin-left: 5px;
    }

.girl-service-mobile {
    display: none;
}

@media (max-width: 767px) {

    .single-portfolio-body-inner-right {
        display: none;
    }

    .girl-service-mobile {
        display: block;
    }

}



.container-girlnamehead {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: start;
        margin: 10px 0;
        @media (min-width: 768px) {
            flex-direction: row;
            align-items: center;
            gap: 15px;
            margin: 0;
			padding-top: 5px;
        }
    }

.subtitle {
		padding: 10px;
	
}

.subtitle2 {
		padding: 10px;
     	align-items: center;
        display: flex;
        gap: 15px;
	
}



/* Section girl-comments */

    section.girl-comments {
        padding: var(--portfolio-inner-padding);
        border-radius: var(--portfolio-inner-border-radius);
        background-color: var(--color-content-bg);
        border: 1px solid var(--color-alt-content-secondary);
        margin: 0 auto;
        p, div, span {
            font-size: 16px !important;
            line-height: 110% !important;
        }
    }


/* =========================================================
   ROYAL LAUFHAUS 28
   SINGLE PORTFOLIO – STYLE MATCH OVERVIEW
   ========================================================= */

.single-portfolio-neonstyle {
    --rl28-gold: #d8b46a;
    --rl28-gold-light: #f0d18c;
    --rl28-purple: #25001f;
    --rl28-purple-dark: #12000f;
    --rl28-purple-light: #3a0734;
    --rl28-border: #76552b;
    --rl28-text: #f4ead7;
    --rl28-muted: #cbbca5;

    background: #000;
    color: var(--rl28-text);
}


/* =========================================================
   HAUPTBEREICH
   ========================================================= */

.single-portfolio-neonstyle .single-portfolio-body {
    padding: 26px;
    background: #000;
    max-width: 1600px;
    margin: 0 auto;
}


/* =========================================================
   GALERIE
   ========================================================= */

.single-portfolio-neonstyle section.girl-gallery {
    margin-bottom: 20px;
}

.single-portfolio-neonstyle section.girl-gallery .girl-photos {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    grid-template-areas: none;
}

.single-portfolio-neonstyle section.girl-gallery .girl-photos > a {
    position: relative;
    display: block;
    height: 530px;
    overflow: hidden;
    border-radius: 15px;
    border: 1px solid var(--rl28-border);
    background: #090909;
    box-shadow: 0 0 15px rgba(120, 75, 20, .15);
}

.single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(1),
.single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(2),
.single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(3),
.single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(4),
.single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(5) {
    grid-area: auto;
}

.single-portfolio-neonstyle section.girl-gallery .girl-photos > a picture {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 14px;
}

.single-portfolio-neonstyle section.girl-gallery .girl-photos > a picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: auto;
    border-radius: 14px;
    transition: transform .4s ease;
}

.single-portfolio-neonstyle section.girl-gallery .girl-photos > a:hover picture img {
    transform: scale(1.03);
}


/* Galerie Anzahl */

.single-portfolio-neonstyle .girl-photos-numberbox {
    position: absolute;
    right: 12px;
    bottom: 10px;
    width: auto !important;
    margin: 0 !important;
    padding: 5px 10px;
    border-radius: 20px;
    background: rgba(0,0,0,.65);
    border: 1px solid rgba(216,180,106,.5);
    color: #fff;
    font-size: 13px !important;
}


/* Play Button */

.single-portfolio-neonstyle .girl-video-desc {
    position: absolute;
    z-index: 5;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
}

.single-portfolio-neonstyle .girl-video-desc i {
    font-size: 55px;
    color: #fff;
    opacity: .9;
    text-shadow: 0 3px 15px #000;
}


/* =========================================================
   NAME / KONTAKT
   ========================================================= */

.single-portfolio-neonstyle section.girl-name {
    margin: 0 0 22px;
}

.single-portfolio-neonstyle section.girl-contact {
    position: relative;
    padding: 22px 28px;
    margin: 0;
    border-radius: 15px;
    background:
        linear-gradient(
            135deg,
            rgba(48, 3, 42, .98),
            rgba(20, 0, 17, .98)
        );
    border: 1px solid var(--rl28-border);
    box-shadow:
        inset 0 0 25px rgba(100, 30, 80, .12),
        0 5px 25px rgba(0,0,0,.5);
}


/* Name + Status */

.single-portfolio-neonstyle .name-status {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.single-portfolio-neonstyle h1.s1xc-portfoliogirl-name {
    margin: 0;
    color: var(--rl28-gold-light);
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px;
}


/* Anwesend */

.single-portfolio-neonstyle .s1xc-available,
.single-portfolio-neonstyle .s1xc-available-next-week {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    margin: 0;
    padding: 7px 18px;
    border-radius: 50px;

    background: linear-gradient(
        135deg,
        #0d8f42,
        #12672f
    );

    border: 1px solid #25d86b;
    box-shadow:
        0 0 8px rgba(20,220,90,.45),
        inset 0 0 8px rgba(255,255,255,.08);

    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
}


/* kleiner grüner Punkt */

.single-portfolio-neonstyle .s1xc-available::before {
    content: "";
    width: 7px;
    height: 7px;
    margin-right: 7px;
    border-radius: 50%;
    background: #28ef72;
    box-shadow: 0 0 7px #28ef72;
}


/* Herkunft / Zimmer */

.single-portfolio-neonstyle .subtitle {
    padding: 10px 0 4px;
    color: var(--rl28-muted);
    font-size: 16px;
}

.single-portfolio-neonstyle .subtitle strong {
    color: var(--rl28-text);
}


/* Kontakt */

.single-portfolio-neonstyle .subtitle2 {
    padding: 10px 0 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    color: var(--rl28-muted);
}


/* =========================================================
   WHATSAPP / TELEFON
   ========================================================= */

.single-portfolio-neonstyle .subtitle2 .whatsapp_icon {
    width: 38px;
    height: 38px;
    display: inline-block;
}

.single-portfolio-neonstyle .subtitle2 .w-btn {
    min-height: 38px;
    padding: 8px 20px !important;
    border-radius: 30px !important;

    background: var(--rl28-purple-light) !important;
    border: 1px solid #7d155f !important;
    color: var(--rl28-gold-light) !important;

    box-shadow: none !important;
}


/* =========================================================
   CONTENT GRID
   ========================================================= */

.single-portfolio-neonstyle .single-portfolio-body-inner {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 22px;
    align-items: start;
}

.single-portfolio-neonstyle .single-portfolio-body-inner-left,
.single-portfolio-neonstyle .single-portfolio-body-inner-right {
    display: grid;
    grid-template-columns: 1fr;
    gap: 22px;
}


/* =========================================================
   ALLE CONTENT BOXEN
   ========================================================= */

.single-portfolio-neonstyle section.girl-bio,
.single-portfolio-neonstyle section.girl-description,
.single-portfolio-neonstyle section.girl-service,
.single-portfolio-neonstyle section.girl-comments {
    padding: 25px;
    margin: 0;
    border-radius: 15px;

    background:
        linear-gradient(
            135deg,
            rgba(12, 12, 12, .98),
            rgba(4, 4, 4, .98)
        );

    border: 1px solid var(--rl28-border);
    box-shadow: 0 5px 20px rgba(0,0,0,.35);
}


/* Überschriften */

.single-portfolio-neonstyle section.girl-bio h2,
.single-portfolio-neonstyle section.girl-description h2,
.single-portfolio-neonstyle section.girl-service h2,
.single-portfolio-neonstyle section.girl-comments h2 {
    margin: 0 0 20px;
    color: var(--rl28-gold-light);
    font-size: 27px;
    font-weight: 800;
    text-transform: uppercase;
    font-style: italic;
}


/* =========================================================
   BIO
   ========================================================= */

.single-portfolio-neonstyle ul.s1xc-bio {
    display: grid;
    gap: 10px;
}

.single-portfolio-neonstyle ul.s1xc-bio li {
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(216,180,106,.15);
}

.single-portfolio-neonstyle ul.s1xc-bio li:last-child {
    border-bottom: 0;
}

.single-portfolio-neonstyle ul.s1xc-bio li span.label {
    color: var(--rl28-muted);
    font-size: 15px;
}

.single-portfolio-neonstyle ul.s1xc-bio li span.value {
    color: var(--rl28-text);
    font-size: 15px;
    font-weight: 700;
}


/* =========================================================
   BESCHREIBUNG
   ========================================================= */

.single-portfolio-neonstyle .s1xc-description {
    color: var(--rl28-text);
}

.single-portfolio-neonstyle .s1xc-description p,
.single-portfolio-neonstyle .s1xc-description {
    font-size: 16px !important;
    line-height: 1.55 !important;
}


/* =========================================================
   SERVICES
   ========================================================= */

.single-portfolio-neonstyle ul.s1xc-services {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.single-portfolio-neonstyle ul.s1xc-services li {
    min-height: 48px;
    margin: 0;
    padding: 9px 12px;

    display: flex;
    align-items: center;

    border-radius: 9px;
    border: 1px solid #65584d;

    background: #202020;

    color: #e8dfd3;

    font-size: 14px;
    filter: none;
    transition:
        background .2s ease,
        border-color .2s ease,
        transform .2s ease;
}

.single-portfolio-neonstyle ul.s1xc-services li:hover {
    background: #2b2b2b;
    border-color: var(--rl28-gold);
    transform: translateY(-1px);
}

.single-portfolio-neonstyle ul.s1xc-services li:before {
    width: 30px;
    height: 30px;
    min-width: 30px;
    margin-right: 10px;

    background: #b9aa9c;
    color: #fff;

    font-size: 13px;
}


/* =========================================================
   KOMMENTARE
   ========================================================= */

.single-portfolio-neonstyle section.girl-comments {
    margin-top: 0;
}

.single-portfolio-neonstyle section.girl-comments p {
    color: var(--rl28-muted);
}


/* =========================================================
   MOBILE SERVICES
   ========================================================= */

.single-portfolio-neonstyle .girl-service-mobile {
    display: none;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 1190px) {

    .single-portfolio-neonstyle .girl-photos {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .single-portfolio-neonstyle .girl-photos > a {
        height: 500px;
    }

    .single-portfolio-neonstyle ul.s1xc-services {
        grid-template-columns: repeat(2, 1fr);
    }
}


@media (max-width: 767px) {

    .single-portfolio-neonstyle .single-portfolio-body {
        padding: 12px;
    }

 /* =========================================================
   MOBILE GALERIE
   1 grosses Bild + 4 kleine Bilder
   ========================================================= */

@media (max-width: 767px) {

    .single-portfolio-neonstyle section.girl-gallery .girl-photos {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "img1 img1"
            "img2 img3"
            "img4 img5";
        gap: 10px;
    }

    /* Erstes Bild = gross über die ganze Breite */
    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(1) {
        grid-area: img1;
    }

    /* Danach 4 kleine Bilder */
    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(2) {
        grid-area: img2;
    }

    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(3) {
        grid-area: img3;
    }

    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(4) {
        grid-area: img4;
    }

    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(5) {
        grid-area: img5;
    }

    /* Ab Bild 6 nichts mehr anzeigen */
    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(n+6) {
        display: none;
    }

    /* Grosses erstes Bild */
    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(1) img {
        aspect-ratio: 2 / 3;
    }

    /* Kleine Bilder */
    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a:nth-child(n+2):nth-child(-n+5) img {
        aspect-ratio: 2 / 3;
    }
}

    /* Kontakt */

    .single-portfolio-neonstyle section.girl-contact {
        padding: 18px;
    }

    .single-portfolio-neonstyle h1.s1xc-portfoliogirl-name {
        font-size: 32px;
    }

    .single-portfolio-neonstyle .name-status {
        gap: 10px;
    }

    /* Content */

    .single-portfolio-neonstyle .single-portfolio-body-inner {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .single-portfolio-neonstyle .single-portfolio-body-inner-right {
        display: none;
    }

    .single-portfolio-neonstyle .girl-service-mobile {
        display: block;
    }

    .single-portfolio-neonstyle section.girl-bio,
    .single-portfolio-neonstyle section.girl-description,
    .single-portfolio-neonstyle section.girl-service,
    .single-portfolio-neonstyle section.girl-comments {
        padding: 18px;
    }

    /* Services */

    .single-portfolio-neonstyle ul.s1xc-services {
        grid-template-columns: 1fr;
        gap: 9px;
    }

}


@media (max-width: 500px) {

    .single-portfolio-neonstyle section.girl-gallery .girl-photos {
        grid-template-columns: 1fr 1fr !important;
    }

    .single-portfolio-neonstyle section.girl-gallery .girl-photos > a {
        height: 300px;
    }

    .single-portfolio-neonstyle h1.s1xc-portfoliogirl-name {
        font-size: 28px;
    }

    .single-portfolio-neonstyle .subtitle {
        font-size: 14px;
    }

}


/* Kontakt-Box */
.single-portfolio-neonstyle section.girl-contact {
  padding: 22px 28px;
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(48,3,42,.98), rgba(20,0,17,.98));
  border: 1px solid var(--rl28-border);
}

.single-portfolio-neonstyle .subtitle {
  padding: 10px 0 4px;
  color: var(--rl28-muted);
  font-size: 16px;
}
.single-portfolio-neonstyle .subtitle strong {
  color: var(--rl28-text);
}

.single-portfolio-neonstyle .contact-box {
  margin-top: 14px;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  border-radius: 12px;
  background: rgba(0,0,0,.3);
  border: 1px solid rgba(216,180,106,.2);
}

.single-portfolio-neonstyle .contact-label {
  color: var(--rl28-gold-light);
  font-size: 14px;
}

.single-portfolio-neonstyle .contact-btns {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.single-portfolio-neonstyle .btn-contact {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 22px;
  border-radius: 100px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none !important;
  line-height: 1;
  transition: transform .15s ease, background .2s ease, color .2s ease;
}

.single-portfolio-neonstyle .btn-contact:hover {
  transform: translateY(-1px);
}

.single-portfolio-neonstyle .btn-wa {
  background: linear-gradient(135deg, #1faa53, #128c4b);
  color: #fff !important;
  box-shadow: 0 4px 18px rgba(37,211,102,.35);
  border: 1px solid #2bde8a;
}

.single-portfolio-neonstyle .btn-wa:hover {
  background: #178a43;
  color: #fff !important;
}

.single-portfolio-neonstyle .btn-call {
  background: transparent;
  color: var(--rl28-gold-light) !important;
  border: 1.5px solid var(--rl28-gold);
}

.single-portfolio-neonstyle .btn-call:hover {
  background: var(--rl28-gold);
  color: #25001f !important;
}

@media (max-width: 767px) {
  .single-portfolio-neonstyle section.girl-contact {
    padding: 18px;
  }
  .single-portfolio-neonstyle .contact-box {
    flex-direction: column;
    align-items: stretch;
  }
  .single-portfolio-neonstyle .contact-btns {
    flex-direction: column;
  }
  .single-portfolio-neonstyle .btn-contact {
    justify-content: center;
    width: 100%;
  }
}