/* =========================================================
   NASRIN BEAUTY — CLEANED STYLESHEET
========================================================= */

:root{
    --rose:#c97c91;
    --rose-dark:#a95e74;
    --deep:#6f3d4d;
    --deep-light:#855466;
    --blush:#f6e1e6;
    --cream:#fbf4ed;
    --gold:#c69b57;
    --gold-light:#e7c98d;
    --ink:#32262b;
    --muted:#75686d;
    --white:#fff;
    --shadow:0 24px 70px rgba(105,58,73,.14);
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:"DM Sans",sans-serif;
    background:#fff9fa;
    color:var(--ink);
    line-height:1.7;
    overflow-x:hidden;
}

h1,
h2,
h3{
    font-family:"Italiana",serif;
    font-weight:400;
}

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

a{
    color:inherit;
}

/* =========================================================
   HEADER
========================================================= */

.site-header{
    height:82px;
    padding:10px 6%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:sticky;
    top:0;
    z-index:1000;
    background:linear-gradient(
        135deg,
        rgba(147,92,112,.96),
        rgba(111,61,77,.96)
    );
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    border-bottom:1px solid rgba(201,155,87,.35);
    box-shadow:0 8px 30px rgba(60,30,40,.16);
}

.brand img{
    width:130px;
    height:58px;
    object-fit:contain;
}

.site-header nav{
    display:flex;
    align-items:center;
    gap:34px;
}

.site-header nav a{
    position:relative;
    color:#fff;
    text-decoration:none;
    font-weight:600;
    transition:.3s;
}

.site-header nav a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-6px;
    width:0;
    height:2px;
    background:var(--gold-light);
    transition:.3s;
}

.site-header nav a:hover{
    color:#f5dfb2;
}

.site-header nav a:hover::after{
    width:100%;
}

.header-cta{
    padding:12px 24px;
    border-radius:999px;
    color:#fff;
    background:linear-gradient(135deg,#d8b46f,#b98942);
    text-decoration:none;
    font-weight:700;
    box-shadow:0 8px 22px rgba(185,137,66,.25);
    transition:.3s;
}

.header-cta:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 30px rgba(185,137,66,.4);
}

/* =========================================================
   HERO
========================================================= */

.hero{
    min-height:calc(100vh - 82px);
    width:100%;
    position:relative;
    isolation:isolate;
    overflow:hidden;
    display:grid;
    grid-template-columns:minmax(0,1fr) 360px;
    align-items:center;
    gap:45px;
    padding:55px 6% 65px;
    background-image:
        linear-gradient(
            90deg,
            rgba(246,215,225,.94) 0%,
            rgba(231,183,199,.78) 27%,
            rgba(190,119,143,.34) 55%,
            rgba(111,61,77,.14) 72%,
            rgba(219,170,187,.68) 100%
        ),
        url("laser-hero.png");
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center 10%;
}

.hero::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    background:
        radial-gradient(circle at 8% 15%,rgba(111,61,77,.24),transparent 35%),
        radial-gradient(circle at 88% 12%,rgba(198,155,87,.16),transparent 28%),
        linear-gradient(180deg,rgba(201,124,145,.08),rgba(111,61,77,.08));
}

.hero > *{
    position:relative;
    z-index:1;
}

.hero-photo,
.hero-photo img{
    display:none !important;
}

.hero-copy{
    width:100%;
    max-width:610px;
    padding:30px 0;
}

.eyebrow{
    display:inline-block;
    color:#b29343;
    font-size:16.5px;
    font-weight:700;
    letter-spacing:1.4px;
    text-transform:uppercase;

    text-shadow:
        0 0 6px rgba(232, 196, 106, 0.901),
        0 0 12px rgba(232, 196, 106, 0.823);
}

.section-label{
    display:inline-block;
    color:var(--rose-dark);
    font-size:12px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
}

.hero h1{
    max-width:700px;
    margin:15px 0 22px;
    font-size:clamp(3.7rem,6vw,6.7rem);
    line-height:.92;
    letter-spacing:-1.5px;
    color:var(--ink);
}

.hero h1 span{
    display:block;
    color:var(--rose-dark);
}

.hero-copy > p{
    max-width:560px;
    margin-bottom:25px;
    color:#66585e;
    font-size:1.05rem;
    line-height:1.75;
}

.trust-list{
    display:flex;
    flex-direction:column;
    max-width:540px;
    gap:9px;
    margin-top:25px;
}

.trust-list span{
    display:flex;
    gap:9px;
    align-items:flex-start;
    color:var(--ink);
    font-size:.9rem;
    font-weight:600;
}

.trust-list i{
    width:23px;
    height:23px;
    display:grid;
    place-items:center;
    flex:none;
    border-radius:50%;
    background:var(--rose);
    color:#fff;
    font-size:10px;
}

/* =========================================================
   BUTTONS
========================================================= */

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:52px;
    padding:14px 24px;
    border:1px solid transparent;
    border-radius:999px;
    text-align:center;
    text-decoration:none;
    font-weight:700;
    transition:.25s;
}

.btn:hover{
    transform:translateY(-3px);
}

.primary{
    color:#fff;
    background:linear-gradient(135deg,var(--rose),var(--rose-dark));
    box-shadow:0 14px 32px rgba(169,94,116,.25);
}

.dark{
    color:#fff;
    background:var(--deep);
}

.outline{
    color:var(--rose-dark);
    background:rgba(255,255,255,.7);
    border-color:rgba(169,94,116,.35);
}

.white{
    color:var(--rose-dark);
    background:#fff;
}

/* =========================================================
   OFFER CARD
========================================================= */

.offer-card{
    position:relative;
    z-index:3;
    width:100%;
    max-width:360px;
    justify-self:end;
    padding:20px;
    border:1px solid rgba(111,61,77,.20);
    border-radius:24px;
    background:rgba(255,238,243,.94);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    box-shadow:
        0 24px 65px rgba(78,39,53,.20),
        0 3px 14px rgba(78,39,53,.08);
}

.badge{
    display:inline-block;
    padding:6px 11px;
    border-radius:999px;
    color:#fff;
    background:var(--deep);
    font-size:9px;
    font-weight:700;
    letter-spacing:.5px;
    text-transform:uppercase;
}

.offer-title{
    margin:12px 0;
    color:var(--gold);
    font-size:10px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
}

.offer-item{
    display:grid;
    gap:5px;
}

.offer-item h2{
    font-size:1.55rem;
    line-height:1;
}

.offer-item p,
.offer-item small{
    color:var(--muted);
    font-size:.82rem;
    line-height:1.45;
}

.price{
    display:flex;
    align-items:baseline;
    gap:10px;
}

.price strong{
    font-family:"Italiana",serif;
    font-size:3.35rem;
    line-height:1;
    color:var(--deep);
}

.price del{
    color:#9d8c91;
}

.offer-card .price{
    gap:8px;
}

.offer-card .price strong{
    font-size:2.75rem;
}

.offer-card .price del{
    font-size:.85rem;
}

.offer-card .btn{
    width:100%;
    min-height:45px;
    margin-top:6px;
    padding:10px 16px;
    font-size:.88rem;
}

.or{
    display:flex;
    align-items:center;
    gap:10px;
    margin:20px 0;
    color:#a68c94;
    font-size:12px;
}

.or::before,
.or::after{
    content:"";
    height:1px;
    flex:1;
    background:rgba(169,94,116,.18);
}

.offer-card .or{
    margin:14px 0;
}

.featured{
    position:relative;
    padding:17px;
    border:1px solid rgba(198,155,87,.3);
    border-radius:19px;
    background:linear-gradient(145deg,#fff,#f8ece1);
}

.offer-card .featured{
    padding:15px;
    border-radius:17px;
    background:linear-gradient(145deg,#fff7f9,#f4dfe5);
}

.choice{
    position:absolute;
    right:13px;
    top:12px;
    color:var(--gold);
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
}

.offer-card .choice{
    top:10px;
    right:10px;
    font-size:8px;
}

/* =========================================================
   GENERAL SECTIONS
========================================================= */

.section,
.dark-section,
.split,
.pricing,
.final-cta{
    padding:100px 7%;
}

.section{
    text-align:center;
}

.section h2,
.section-head h2,
.pricing h2{
    max-width:980px;
    margin:13px auto 49px;
    font-size:clamp(2.4rem,4.7vw,4rem);
    line-height:1.08;
}

.grid{
    display:grid;
    gap:22px;
}

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

.three{
    grid-template-columns:repeat(3,1fr);
}

.card{
    padding:31px 25px;
    border:1px solid rgba(201,124,145,.14);
    border-radius:25px;
    background:#fff;
    box-shadow:0 15px 42px rgba(105,58,73,.07);
    transition:.3s ease;
}

.card:hover{
    transform:translateY(-7px);
    box-shadow:var(--shadow);
}

.icon{
    width:61px;
    height:61px;
    display:grid;
    place-items:center;
    margin:0 auto 20px;
    border-radius:18px;
    color:var(--rose-dark);
    background:var(--blush);
    font-size:23px;
}

.card h3,
.dark-card h3{
    margin-bottom:12px;
    font-size:1.7rem;
    line-height:1.1;
}

.card p{
    color:var(--muted);
}

.gold-card{
    background:linear-gradient(145deg,#fff,#faf0e5);
    border-color:rgba(198,155,87,.35);
}

.actions{
    display:flex;
    justify-content:center;
    gap:13px;
    flex-wrap:wrap;
    margin-top:36px;
}

.actions.left{
    justify-content:flex-start;
}

/* =========================================================
   DARK SECTION
========================================================= */

.dark-section{
    color:#fff;
    background:linear-gradient(145deg,var(--deep),#462832);
}

.section-head{
    max-width:900px;
    margin:0 auto 45px;
    text-align:center;
}

.section-head h2{
    margin-bottom:17px;
}

.section-head p{
    color:rgba(255,255,255,.72);
}

.light{
    color:#ead3ad;
}

.dark-card{
    position:relative;
    padding:34px 28px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:25px;
    background:rgba(255,255,255,.08);
}

.dark-card > span{
    color:#ead3ad;
    font-size:12px;
    font-weight:700;
    letter-spacing:2px;
}

.dark-card .icon{
    margin:18px 0;
    color:#ead3ad;
    background:rgba(255,255,255,.1);
}

.dark-card p{
    color:rgba(255,255,255,.72);
}

.popular{
    background:linear-gradient(145deg,rgba(201,124,145,.35),rgba(255,255,255,.08));
}

.popular b{
    position:absolute;
    right:16px;
    top:16px;
    padding:6px 10px;
    border-radius:999px;
    color:var(--deep);
    background:#ead3ad;
    font-size:10px;
}

/* =========================================================
   SPLIT SECTIONS / RESULTS / TREATMENT
========================================================= */

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

.split h2{
    margin:13px 0 22px;
    font-size:clamp(2.5rem,4.8vw,4rem);
    line-height:1.08;
}

.split > div > p{
    margin-bottom:25px;
    color:var(--muted);
}

.results{
    background:#faecef;
}

.split figure{
    padding:12px;
    overflow:hidden;
    border-radius:30px;
    background:#fff;
    box-shadow:var(--shadow);
}

.split figure img{
    width:100%;
    height:auto;
    border-radius:21px;
}

.split figcaption{
    padding:10px 4px 2px;
    color:var(--muted);
    text-align:center;
    font-size:12px;
}

.checks{
    margin:25px 0;
    list-style:none;
}

.checks li{
    position:relative;
    margin-bottom:12px;
    padding-left:37px;
    font-weight:600;
}

.checks li::before{
    content:"✓";
    position:absolute;
    left:0;
    top:1px;
    width:25px;
    height:25px;
    display:grid;
    place-items:center;
    border-radius:50%;
    color:#fff;
    background:var(--rose);
    font-size:11px;
}

.note{
    margin-top:22px !important;
    padding:14px;
    border-left:3px solid var(--gold);
    background:rgba(255,255,255,.65);
    font-size:.9rem;
}

.treatment{
    background:#fff9fa;
}

.treatment figure{
    padding:0;
    border-radius:38px 38px 95px 38px;
}

.treatment figure img{
    border-radius:inherit;
}

/* Reviews */

.review-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(280px,430px));
    justify-content:center;
    align-items:stretch;

    max-width:900px;
    margin:40px auto 0;
    gap:24px;
}

.review{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    align-items:center;

    min-height:50px;
    padding:12px;

    text-align:center;

    background:linear-gradient(
        180deg,
        #694050 0%,
        #4F2F3C 100%
    );

    border:1px solid rgba(214,183,127,.22);
    border-radius:20px;

    box-shadow:
        0 0 18px rgba(214,183,127,.08),
        0 14px 34px rgba(46,25,34,.24);
}

.review div{
    color:#d4af37;
    font-size:1.15rem;
    letter-spacing:3px;
    margin-bottom:12px;
}

.review p{
    margin:0;

    color:#fff;
    font-size:.94rem;
    line-height:1.55;
}

.review-author{
    display:block;
    margin-top:16px;

    color:#eadde3;
    font-size:.9rem;
    font-weight:700;
}

@media (max-width:900px){

    .review-grid{
        grid-template-columns:1fr;
        max-width:500px;
        gap:18px;
        margin-top:30px;
    }

    .review{
        min-height:auto;
        padding:24px;
    }

}
/* =========================================================
   PRICING
========================================================= */

.pricing{
    background:var(--cream);
    text-align:center;
}

.section-copy{
    max-width:720px;
    margin:-27px auto 38px;
    color:var(--muted);
}

.pricing-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,430px));
    justify-content:center;
    gap:25px;
}

.price-card{
    display:grid;
    gap:10px;
    padding:36px;
    border:1px solid rgba(201,124,145,.16);
    border-radius:28px;
    background:#fff;
    box-shadow:var(--shadow);
}

.price-card h3{
    font-size:2rem;
}

.price-card > strong{
    font-family:"Italiana",serif;
    font-size:4.4rem;
    line-height:1;
    color:var(--deep);
}

.price-card del{
    color:#9b8a90;
}

.price-card.best{
    position:relative;
    border:2px solid rgba(198,155,87,.45);
    background:linear-gradient(145deg,#fff,#f8e9dc);
}

.price-card.best > b{
    position:absolute;
    top:16px;
    right:16px;
    padding:7px 12px;
    border-radius:999px;
    color:#fff;
    background:var(--gold);
    font-size:11px;
}

.deposit{
    margin-top:26px;
    color:var(--deep);
    font-weight:600;
}

/* =========================================================
   FAQ
========================================================= */

.faq{
    max-width:900px;
    margin:60px auto 0;

    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px 18px;
    align-items:start;

    text-align:left;
    interpolate-size:allow-keywords;
}

.faq details{
    margin:0;
    overflow:hidden;
    border:none;
    border-radius:20px;
    background:transparent;
}

.faq details[open]{
    grid-column:1 / -1;
}

.faq summary{
    position:relative;
    z-index:2;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;

    padding:20px 24px;

    cursor:pointer;
    list-style:none;

    color:#fff;
    background:linear-gradient(135deg,var(--deep),#865367);

    border-radius:20px;

    box-shadow:0 12px 28px rgba(111,61,77,.16);

    font-size:17px;
    font-weight:700;

    transition:
        border-radius .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}

.faq summary::-webkit-details-marker{
    display:none;
}

.faq summary i{
    width:32px;
    height:32px;

    display:grid;
    place-items:center;

    flex-shrink:0;

    border-radius:50%;

    color:#efd39d;
    background:rgba(255,255,255,.14);

    transition:
        transform .35s ease,
        background .3s ease;
}

.faq details::details-content{
    block-size:0;
    overflow:hidden;
    opacity:0;

    transition:
        block-size .4s ease,
        opacity .3s ease,
        content-visibility .4s allow-discrete;
}

.faq details[open]::details-content{
    block-size:auto;
    opacity:1;
}

.faq details p{
    margin:0;
    padding:22px 24px;

    border:1px solid rgba(201,124,145,.16);
    border-top:none;
    border-radius:0 0 20px 20px;

    color:var(--muted);
    background:#fff5f7;

    line-height:1.75;
}

.faq details[open] summary{
    border-radius:20px 20px 0 0;
    box-shadow:none;
}

.faq details[open] summary i{
    transform:rotate(45deg);
    background:rgba(255,255,255,.22);
}

/* ===============================
   Mobile
================================ */

@media (max-width:700px){

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

    .faq details[open]{
        grid-column:1 / -1;
    }

    .faq summary{
        padding:16px;
        font-size:15px;
    }

    .faq details p{
        padding:18px;
        font-size:14px;
    }
}
/* =========================================================
   FINAL CTA
========================================================= */

.final-cta{
    color:#fff;
    background:linear-gradient(135deg,var(--deep),#4a2934);
    text-align:center;
}

.final-cta h2{
    margin:13px auto 20px;
    font-size:clamp(2.6rem,5vw,4.5rem);
    line-height:1.05;
}

.final-cta > p{
    max-width:700px;
    margin:0 auto 27px;
    color:rgba(255,255,255,.82);
}

.pills{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px;
    margin-bottom:30px;
}

.pills span{
    padding:10px 15px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:999px;
    background:rgba(255,255,255,.08);
}

/* =========================================================
   FOOTER
========================================================= */

footer{
    color:#fff;
    background:#38242c;
}

.footer-main{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
    padding:45px 7%;
}

.footer-main img{
    width:120px;
    height:58px;
    object-fit:contain;
    margin-bottom:10px;
    filter:brightness(0) invert(1);
}

.footer-main h2{
    font-size:2rem;
}

.footer-main p{
    color:rgba(255,255,255,.7);
}

.footer-bottom{
    display:flex;
    justify-content:space-between;
    padding:18px 7%;
    border-top:1px solid rgba(255,255,255,.1);
    color:rgba(255,255,255,.7);
    font-size:14px;
}

.footer-bottom nav{
    display:flex;
    gap:20px;
}

.footer-bottom a{
    text-decoration:none;
}

/* =========================================================
   FLOATING CONTACT BUTTONS
========================================================= */

.floating{
    position:fixed;
    right:18px;
    bottom:18px;
    z-index:999;

    display:flex;
    flex-direction:column;
    gap:10px;
}

.floating a{
    width:56px;
    height:56px;

    display:grid;
    place-items:center;

    padding:0;

    border-radius:50%;

    color:inherit;
    background:rgba(255,255,255,.96);

    text-decoration:none;
    font-weight:700;

    box-shadow:
        0 12px 30px rgba(68,34,45,.18);

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.floating a:hover{
    transform:translateY(-4px) scale(1.06);
    box-shadow:
        0 18px 36px rgba(68,34,45,.24);
}

.floating a span{
    display:none !important;
}

.floating a i{
    margin:0;
    color:var(--rose);
    font-size:22px;
}

.floating .wa{
    color:#fff;
    background:#25d366;
}

.floating .wa i{
    color:#fff;
}
/* =========================================================
   LEGAL PAGES
========================================================= */

.legal{
    max-width:900px;
    margin:auto;
    padding:70px 6%;
}

.legal h1{
    margin-bottom:25px;
    font-size:3.2rem;
}

.legal h2{
    margin:28px 0 8px;
    font-size:1.8rem;
}

.legal p,
.legal li{
    color:var(--muted);
}

.legal ul{
    padding-left:22px;
}

/* =========================================================
   RESPONSIVE — TABLET
========================================================= */

@media(max-width:1100px){
    .hero{
        min-height:auto;
        grid-template-columns:minmax(0,1fr) 330px;
        gap:28px;
        padding-top:70px;
        padding-bottom:70px;
        background-position:center top;
    }

    .hero h1{
        font-size:clamp(3.3rem,6vw,5.4rem);
    }

    .offer-card{
        max-width:330px;
    }

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

/* =========================================================
   RESPONSIVE — SMALL TABLET
========================================================= */

@media(max-width:820px){
    .hero{
        min-height:auto;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        padding:65px 6% 55px;
        background-image:
            linear-gradient(
                180deg,
                rgba(246,215,225,.94) 0%,
                rgba(238,196,209,.84) 30%,
                rgba(201,133,157,.28) 56%,
                rgba(111,61,77,.22) 76%,
                rgba(246,215,225,.92) 100%
            ),
            url("laser-hero.png");
        background-size:auto 100%;
        background-position:center top;
    }

    .hero-copy{
        max-width:580px;
        padding:0;
        text-align:left;
    }

    .hero-copy > p{
        margin-left:0;
        margin-right:0;
    }

    .trust-list{
        margin-left:0;
        margin-right:0;
    }

    .offer-card{
        width:min(100%,430px);
        max-width:430px;
        margin:260px auto 0;
        justify-self:auto;
    }

    .three,
    .split,
    .pricing-grid{
        grid-template-columns:1fr;
    }

    .split{
        gap:38px;
    }

    .treatment figure{
        order:2;
    }

    .mobile-first-cta{
        width:100%;
        max-width:420px;
    }

    .footer-main,
    .footer-bottom{
        flex-direction:column;
        text-align:center;
    }

    .footer-bottom nav{
        justify-content:center;
    }
}



/* =========================================================
   CLEAN MOBILE STYLES
========================================================= */

@media (max-width:600px){

    html{
        font-size:15px;
        width:100%;
        overflow-x:hidden;
    }

    body{
        width:100%;
        max-width:100%;
        overflow-x:hidden;
        font-size:15px;
        line-height:1.6;
    }

    img,
    video,
    svg{
        max-width:100%;
        height:auto;
    }

    .section,
    .dark-section,
    .pricing,
    .final-cta,
    .split,
    .treatment,
    .reviews{
        width:100%;
        max-width:100%;
        padding:52px 20px;
        overflow-x:hidden;
    }

    .section-head{
        margin-bottom:28px;
    }

.section-label{
    font-size:.72rem;
    letter-spacing:1.4px;
}

.eyebrow{
    font-size:1rem;
    letter-spacing:1.4px;
}

    .section h2,
    .section-head h2,
    .dark-section h2,
    .pricing h2,
    .final-cta h2,
    .split h2{
        margin:8px 0 18px;
        font-size:2rem;
        line-height:1.15;
    }

    p{
        font-size:.95rem;
        line-height:1.65;
    }

    /* HEADER */

    .site-header{
        height:64px;
        padding:7px 18px;
    }

    .brand img{
        width:90px;
        height:auto;
    }

    .site-header nav{
        display:none;
    }

    .header-cta{
        padding:10px 14px;
        font-size:.8rem;
        white-space:nowrap;
    }

    /* HERO */

    .hero{
        min-height:auto;
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:24px;
        padding:42px 20px 48px;
        background-image:
            linear-gradient(
                180deg,
                rgba(250,230,237,.94) 0%,
                rgba(239,199,212,.80) 55%,
                rgba(176,112,134,.45) 100%
            ),
            url("laser-hero.png");
        background-size:cover;
        background-position:62% top;
    }

    .hero-copy{
        width:100%;
        max-width:330px;
        padding:0;
        text-align:left;
    }

    .hero h1{
        max-width:320px;
        margin:8px 0 14px;
        font-size:2.7rem;
        line-height:1;
        letter-spacing:-.5px;
    }

    .hero-copy > p{
        max-width:310px;
        margin-bottom:18px;
        font-size:.95rem;
        line-height:1.55;
    }

    .hero .actions{
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:10px;
        width:100%;
        max-width:300px;
        margin-top:14px;
    }

    .hero .btn{
        width:100%;
    }

    .trust-list{
        display:grid;
        grid-template-columns:1fr;
        gap:8px;
        max-width:310px;
        margin-top:18px;
    }

    .trust-list span{
        gap:8px;
        font-size:.82rem;
        line-height:1.35;
    }

    .trust-list i{
        width:22px;
        height:22px;
        font-size:9px;
    }

    /* OFFER CARD */

    .offer-card{
        width:100%;
        max-width:350px;
        margin:180px auto 0;
        padding:20px;
        border-radius:20px;
    }

    .offer-card .badge{
        padding:5px 9px;
        font-size:.62rem;
    }

    .offer-title{
        margin:10px 0;
        font-size:.68rem;
    }

    .offer-item h2{
        font-size:1.45rem;
    }

    .offer-item p,
    .offer-item small{
        font-size:.82rem;
        line-height:1.45;
    }

    .offer-card .price strong{
        font-size:2.4rem;
    }

    .offer-card .price del{
        font-size:.84rem;
    }

    .offer-card .btn{
        min-height:46px;
        padding:11px 16px;
        font-size:.88rem;
    }

    .offer-card .or{
        margin:12px 0;
        font-size:.72rem;
    }

    .offer-card .featured{
        padding:14px;
        border-radius:15px;
    }

    /* BUTTONS */

    .btn{
        min-height:46px;
        padding:12px 18px;
        font-size:.9rem;
    }

    .actions,
    .actions.left{
        display:flex;
        flex-direction:column;
        align-items:stretch;
        gap:10px;
        width:100%;
        margin-top:24px;
    }

    .actions .btn{
        width:100%;
    }

    /* GENERAL GRIDS AND CARDS */

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

    .card,
    .dark-card{
        min-height:0;
        padding:20px 16px;
        border-radius:18px;
    }

    .icon,
    .card .icon,
    .dark-card .icon{
        width:42px;
        height:42px;
        margin:0 auto 12px;
        border-radius:12px;
        font-size:17px;
    }

    .card h3,
    .dark-card h3{
        margin-bottom:8px;
        font-size:1.15rem;
        line-height:1.2;
    }

    .card p,
    .dark-card p{
        font-size:.86rem;
        line-height:1.5;
    }

    .popular b{
        top:9px;
        right:9px;
        padding:4px 7px;
        font-size:.58rem;
    }

    /* BEHANDLUNGSZONEN */

    .dark-section .grid.three{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:12px;
        width:100%;
        max-width:520px;
        margin:0 auto;
    }

    .dark-section .grid.three .dark-card{
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        min-height:120px;
        padding:14px 12px;
        text-align:center;
    }

    .dark-section .grid.three .dark-card:nth-child(3){
        grid-column:1/-1;
        width:calc(50% - 6px);
        justify-self:center;
    }

    .dark-section .grid.three .dark-card .icon{
        width:30px;
        height:30px;
        margin:5px auto 8px;
        font-size:12px;
    }

    .dark-section .grid.three .dark-card h3{
        margin-bottom:4px;
        font-size:.95rem;
    }

    .dark-section .grid.three .dark-card p{
        font-size:.75rem;
        line-height:1.3;
    }

    /* SPLIT SECTIONS */

    .split{
        grid-template-columns:42% minmax(0,1fr);
        gap:18px;
        align-items:center;
    }

    .split > div{
        min-width:0;
    }

    .split h2{
        font-size:1.65rem;
    }

    .split > div > p{
        margin-bottom:14px;
        font-size:.86rem;
        line-height:1.5;
    }

    .split figure{
        width:100%;
        margin:0;
        padding:6px;
        border-radius:18px;
    }

    .split figure img{
        width:100%;
        max-height:260px;
        object-fit:cover;
        border-radius:14px;
    }

    .split figcaption{
        padding-top:6px;
        font-size:.65rem;
    }

    .treatment{
        grid-template-columns:minmax(0,1fr) 38%;
    }

    .treatment figure{
        order:2;
        padding:0;
        border-radius:20px 20px 48px 20px;
    }

    .checks{
        margin:14px 0;
    }

    .checks li{
        margin-bottom:8px;
        padding-left:28px;
        font-size:.8rem;
        line-height:1.4;
    }

    .checks li::before{
        width:20px;
        height:20px;
        font-size:8px;
    }

    .note{
        margin-top:14px!important;
        padding:10px;
        font-size:.75rem;
        line-height:1.45;
    }

    /* REVIEWS */

    .review-grid{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:12px;
        width:100%;
        max-width:520px;
        margin:28px auto 0;
    }

    .review{
        min-height:0;
        padding:18px 14px;
        border-radius:16px;
    }

    .review div{
        margin-bottom:9px;
        font-size:.95rem;
        letter-spacing:1.5px;
    }

    .review p{
        font-size:.82rem;
        line-height:1.5;
    }

    .review-author{
        margin-top:12px;
        font-size:.78rem;
    }

    /* PRICING */

    .section-copy{
        max-width:330px;
        margin:-5px auto 24px;
        font-size:.9rem;
        line-height:1.5;
    }

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

    .price-card{
        min-width:0;
        gap:8px;
        padding:20px 14px;
        border-radius:18px;
    }

    .price-card h3{
        font-size:1.15rem;
    }

    .price-card > strong{
        font-size:2.6rem;
    }

    .price-card p,
    .price-card del,
    .price-card span{
        font-size:.8rem;
        line-height:1.4;
    }

    .price-card .btn{
        min-height:42px;
        padding:10px 8px;
        font-size:.75rem;
    }

    .price-card.best > b{
        top:8px;
        right:8px;
        padding:4px 7px;
        font-size:.55rem;
    }

    .deposit{
        margin-top:16px;
        font-size:.8rem;
    }

    /* FAQ */

    .faq{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
        width:100%;
        max-width:520px;
        margin:26px auto 0;
        align-items:start;
    }

    .faq details{
        width:100%;
        min-width:0;
        margin:0;
        border-radius:14px;
    }

    .faq summary{
        width:100%;
        min-height:72px;
        padding:13px;
        gap:8px;
        border-radius:14px;
        font-size:.88rem;
        line-height:1.3;
        text-align:left;
    }

    .faq summary i{
        flex:0 0 24px;
        width:24px;
        height:24px;
        font-size:.74rem;
    }

    .faq details[open]{
        grid-column:1/-1;
    }

    .faq details[open] summary{
        min-height:auto;
        border-radius:14px 14px 0 0;
    }

    .faq details p{
        padding:14px;
        border-radius:0 0 14px 14px;
        font-size:.86rem;
        line-height:1.55;
    }

    /* FINAL CTA */

    .final-cta > p{
        max-width:340px;
        margin:0 auto 20px;
        font-size:.92rem;
    }

    .pills{
        gap:8px;
        margin-bottom:20px;
    }

    .pills span{
        padding:8px 10px;
        font-size:.76rem;
    }

    /* FOOTER */

    .footer-main{
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:14px;
        padding:28px 20px 22px;
        text-align:center;
    }

    .footer-main > div{
        width:100%;
        max-width:320px;
    }

    .footer-main img{
        width:90px;
        height:auto;
        margin:0 auto 8px;
    }

    .footer-main h2{
        margin:0 0 6px;
        font-size:1.25rem;
        line-height:1.15;
    }

    .footer-main p{
        margin:0;
        font-size:.82rem;
        line-height:1.5;
    }

    .footer-main .btn{
        display:inline-flex;
        width:auto;
        max-width:260px;
        min-height:42px;
        margin:4px auto 0;
        padding:11px 22px;
        font-size:.82rem;
        white-space:normal;
    }

    .footer-bottom{
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:10px;
        padding:14px 20px;
        text-align:center;
        font-size:.72rem;
        line-height:1.4;
    }

    .footer-bottom nav{
        display:flex;
        justify-content:center;
        flex-wrap:wrap;
        gap:8px 14px;
    }

    /* FLOATING BUTTONS */

    .floating{
        right:10px;
        bottom:10px;
        gap:7px;
    }

    .floating a{
        width:42px;
        height:42px;
    }

    .floating a i{
        font-size:15px;
    }
}

@media (max-width:380px){
    .section,
    .dark-section,
    .pricing,
    .final-cta,
    .split,
    .treatment,
    .reviews{
        padding-left:16px;
        padding-right:16px;
    }

    .hero{
        padding-left:16px;
        padding-right:16px;
    }

    .hero h1{
        font-size:2.4rem;
    }

    .four,
    .three,
    .review-grid,
    .pricing-grid{
        gap:9px;
    }

    .card,
    .dark-card,
    .review,
    .price-card{
        padding-left:11px;
        padding-right:11px;
    }

    .faq{
        gap:8px;
    }

    .faq summary{
        padding:11px;
        font-size:.82rem;
    }
}

/* =========================================================
   FINAL MOBILE LAYOUT FIXES
   - removes empty side space in split sections
   - shortens the hero and reveals more of the hero image
========================================================= */
@media (max-width:600px){

    /* HERO: shorter and image more visible */

.hero{
    min-height:auto !important;
    gap:18px !important;
    padding:34px 20px 34px !important;

    background-size:auto 490px !important;
    background-position:72% top !important;
}

.hero-copy{
    max-width:300px !important;
}

.hero h1{
    max-width:285px !important;
    font-size:2.5rem !important;
}

.hero-copy > p{
    max-width:280px !important;
}

    .offer-card{
        max-width:340px!important;
        margin:48px auto 0!important;
    }

    /* RESULTS + TREATMENT: full-width stacked layout */
    .split,
    .treatment{
        display:grid!important;
        grid-template-columns:1fr!important;
        gap:22px!important;
        align-items:start!important;
        padding-top:42px!important;
        padding-bottom:42px!important;
    }

    .split > div,
    .treatment > div,
    .split figure,
    .treatment figure{
        width:100%!important;
        max-width:100%!important;
    }

    .split figure,
    .treatment figure{
        order:2!important;
        margin:0!important;
    }

    .split figure img,
    .treatment figure img{
        width:100%!important;
        max-height:310px!important;
        object-fit:cover!important;
        object-position:center!important;
    }

    .split h2,
    .treatment h2{
        max-width:100%!important;
        font-size:1.9rem!important;
    }

    .split > div > p,
    .treatment > div > p{
        max-width:100%!important;
        font-size:.92rem!important;
        line-height:1.6!important;
    }

    .checks{
        width:100%!important;
    }

    .note{
        width:100%!important;
        max-width:100%!important;
        margin-top:16px!important;
    }

    .split .actions,
    .treatment .actions{
        width:100%!important;
        max-width:100%!important;
    }


/* ===== Offer card gold glow only (does NOT change layout) ===== */
.offer-card{
    position:relative;

    box-shadow:
        0 0 0 2px rgba(212,181,108,.55),
        0 0 18px rgba(212,181,108,.50),
        0 0 38px rgba(212,181,108,.35),
        0 0 65px rgba(212,181,108,.22) !important;
}

.offer-card::after{
    content:"";
    position:absolute;
    inset:-5px;
    border-radius:inherit;
    z-index:-1;
    pointer-events:none;

    background:radial-gradient(
        circle,
        rgba(212,181,108,.18) 0%,
        rgba(212,181,108,.10) 45%,
        transparent 85%
    );

    filter:blur(12px);
}
}
@media (max-width:600px){

    html,
    body{
        width:100%;
        max-width:100%;
        overflow-x:hidden !important;
    }

    *{
        box-sizing:border-box;
    }

    img,
    video,
    iframe{
        max-width:100%;
        height:auto;
    }

    .hero,
    section,
    .container,
    .offer-section,
    .offer-card{
        max-width:100% !important;
    }
}

/* =========================================================
   MOBILE HORIZONTAL OVERFLOW SAFETY
   Keeps animated/glowing elements from creating side scroll.
========================================================= */
@media (max-width:600px){
    html,
    body{
        overflow-x:clip !important;
    }

    main,
    .site-header,
    footer,
    .hero,
    .section,
    .dark-section,
    .split,
    .pricing,
    .final-cta{
        max-width:100%;
        overflow-x:clip;
    }
}