/* ======================================================
   PREMIUM MOVERS CASE STUDY
====================================================== */

body{
    background:#151518;
    color:#fff;
    overflow-x:hidden;
}

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

.pm-hero{
    position:relative;

    padding:320px 8% 260px;

    overflow:hidden;
}

.pm-hero::before{

    content:"";

    position:absolute;
    inset:0;

    background:
        linear-gradient(
            to bottom,
            rgba(0,0,0,.30) 0%,
            rgba(0,0,0,.45) 35%,
            rgba(21,21,24,.78) 70%,
            #151518 100%
        ),
        url("../images/IMG_4506.JPG");

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;

    z-index:-1;
}



.pm-hero-content{
    max-width:1200px;
}

.pm-label{
    display:inline-block;

    margin-bottom:28px;

    font-size:12px;
    letter-spacing:4px;
    text-transform:uppercase;

    color:#fff;
}

.pm-hero h1{
    font-family:'Playfair Display',serif;
    font-style:italic;
    font-weight:500;

    font-size:110px;
    line-height:.95;
    letter-spacing:-3px;

    margin-bottom:20px;
}

.pm-hero h2{
    font-family:'Playfair Display',serif;
    font-weight:500;

    font-size:54px;
    line-height:1.05;

    color:rgba(255,255,255,.82);

    margin-bottom:35px;
}

.pm-hero p{
    max-width:720px;

    font-size:18px;
    line-height:1.9;

    color:rgba(255,255,255,.65);
}

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

@media(max-width:1200px){

    .pm-hero h1{
        font-size:90px;
    }

    .pm-hero h2{
        font-size:38px;
    }

}

@media(max-width:768px){

    .pm-hero{

        padding:220px 8% 160px;
    }

    .pm-label{

        gap:12px;

        letter-spacing:3px;
    }

    .pm-label::before{

        width:40px;
    }

    .pm-hero h1{

        font-size:58px;
    }

    .pm-hero h2{

        font-size:30px;
    }

    .pm-hero p{

        font-size:16px;
    }

}

/* ======================================================
   PROJECT SNAPSHOT
====================================================== */

.pm-snapshot{
    padding:100px 8% 100px;
}

.pm-snapshot-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:60px;

    padding:60px 0;

    border-top:1px solid rgba(255,255,255,.08);
    border-bottom:1px solid rgba(255,255,255,.08);
}

.pm-snapshot-item{
    display:flex;
    flex-direction:column;
}

.pm-snapshot-item span{
    margin-bottom:18px;

    font-size:11px;
    letter-spacing:3px;
    text-transform:uppercase;

    color:rgba(255,255,255,.40);
}

.pm-snapshot-item h3{
    font-size:22px;
    font-weight:500;

    margin-bottom:8px;
}

.pm-snapshot-item p{
    font-size:16px;
    line-height:1.8;
    color:#fff;
}

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

.pm-section-header{
    max-width:900px;
    margin-bottom:90px;
}

.section-label{
    display:inline-block;

    margin-bottom:20px;

    font-size:12px;
    letter-spacing:3px;
    text-transform:uppercase;

    color:#fff;
}

.pm-section-header h2{
    font-family:'Playfair Display',serif;
    font-style:italic;
    font-weight:500;

    font-size:72px;
    line-height:1;
}

/* ======================================================
   STORY SECTION
====================================================== */

.pm-story{

    padding:220px 8%;

}

/* ======================================================
   ROWS
====================================================== */

.story-row{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:100px;

    align-items:center;
}

.strategy-row{

    margin-top:40px;

}

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

.story-content{

    max-width:650px;

}

.story-content h2{

    font-family:'Playfair Display',serif;

    font-size:72px;

    font-style:italic;

    font-weight:500;

    line-height:1;

    letter-spacing:-2px;

    margin:20px 0 40px;

}

.story-content p{

    font-size:18px;

    line-height:1.9;

    color:rgba(255,255,255,.68);

    margin-bottom:24px;

}

/* ======================================================
   IMAGES
====================================================== */

.story-image{

    width:100%;

    aspect-ratio:1 / 1;

    overflow:hidden;

    border-radius:28px;

    border:1px solid rgba(255,255,255,.08);

    background:#1b1b1f;
}

.story-image img{

    width:100%;
    height:100%;

    object-fit:cover;

    display:block;

    transition:transform .8s ease;
}


/* ======================================================
   CONNECTOR
====================================================== */

.story-connector{

    position:relative;

    height:200px;

}

.connector-line{

    position:absolute;

    left:50%;

    top:0;

    width:1px;

    height:100%;

    background:rgba(255,255,255,.12);

    transform:translateX(-50%);

}

.connector-circle{

    position:absolute;

    left:50%;
    top:50%;

    width:18px;
    height:18px;

    border-radius:50%;

    background:#151518;

    border:2px solid rgba(255,255,255,.18);

    transform:translate(-50%,-50%) scale(.6);

    opacity:.4;

    transition:
    transform 1.6s cubic-bezier(.22,.61,.36,1),
    opacity 1.6s ease,
    background 1.2s ease,
    box-shadow 1.2s ease,
    border-color 1.2s ease;
}

.connector-circle.active{

    transform:translate(-50%,-50%) scale(1);

    opacity:1;

    background:#fff;

    border-color:#fff;

    box-shadow:
        0 0 18px rgba(255,255,255,.45),
        0 0 40px rgba(255,255,255,.18);
}

/* ======================================================
   APPROACH LIST
====================================================== */

.strategy-list{

    display:flex;
    flex-direction:column;

    gap:28px;

    margin-top:40px;

}

.strategy-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

}

.strategy-number{

    width:10px;
    height:10px;

    min-width:10px;

    margin-top:10px;

    border-radius:50%;

    background:#fff;

    font-size:0;
}

.strategy-text h3{

    font-family:'Playfair Display',serif;

    font-size:28px;

    font-style:italic;

    font-weight:500;

    margin:0 0 8px;

    color:#fff;

}

.strategy-text p{

    margin:0;

    font-size:17px;

    line-height:1.75;

    color:rgba(255,255,255,.68);

}

/* ======================================================
   RESPONSIVE
====================================================== */

@media(max-width:1100px){

    .story-row{

        grid-template-columns:1fr;

        gap:60px;

    }

    .strategy-row{

        margin-top:80px;

    }

    .story-content{

        max-width:100%;

    }

    .story-content h2{

        font-size:56px;

    }

    .story-connector{

        display:none;

    }

}

@media(max-width:768px){

    .pm-story{

        padding:160px 8%;

    }

    .story-content h2{

        font-size:42px;

    }

    .strategy-item{

        flex-direction:column;

        gap:12px;

    }

}


/* ======================================================
   WEBSITE SHOWCASE
====================================================== */

.pm-showcase{

    padding:220px 8%;

    position:relative;

}

.showcase-header{

    max-width:850px;

    margin:0 auto 160px;

    text-align:center;

}

.showcase-header h2{

    font-family:'Playfair Display',serif;

    font-size:72px;

    font-style:italic;

    font-weight:500;

    line-height:1;

    letter-spacing:-2px;

    margin:20px 0 30px;

}

.showcase-header p{

    max-width:650px;

    margin:auto;

    font-size:18px;

    line-height:1.9;

    color:rgba(255,255,255,.68);

}

/* ======================================================
   BROWSER WINDOW
====================================================== */

.browser-window{

    overflow:hidden;

    border-radius:24px;

    border:1px solid rgba(255,255,255,.08);

    background:#18181d;

    box-shadow:
        0 40px 90px rgba(0,0,0,.45);

}

/* ======================================================
   TOP BAR
====================================================== */

.browser-top{

    height:56px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:0 22px;

    background:#1d1d22;

    border-bottom:1px solid rgba(255,255,255,.08);

}

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

.browser-controls{

    display:flex;
    align-items:center;
    gap:10px;

}

.browser-btn{

    width:16px;
    height:16px;

    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    flex-shrink:0;

}

.browser-btn svg{

    width:10px;
    height:10px;

    opacity:1;

    display:block;

}

/* Close */

.close{

    background:#ff5f57;

}

.close svg{

    color:#7d0000;

}

/* Minimise */

.minimise{

    background:#febc2e;

}

.minimise svg{

    color:#7a5200;

}

/* Maximise */

.maximise{

    background:#28c840;

}

.maximise svg{

    color:#005d18;

}

/* ======================================================
   ADDRESS BAR
====================================================== */

.browser-address{

    position:absolute;

    left:50%;

    transform:translateX(-50%);

    display:flex;

    align-items:center;

    gap:8px;

    padding:8px 18px;

    border-radius:999px;

    background:rgba(255,255,255,.05);

    border:1px solid rgba(255,255,255,.08);

    font-size:12px;

    color:rgba(255,255,255,.55);

}

.lock-icon{

    width:13px;

    height:13px;

}

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

.browser-content{

    overflow:hidden;

}

.browser-content img{

    width:100%;

    display:block;

    transition:transform 10s ease;

}


/* ======================================================
   DESCRIPTION
====================================================== */

.showcase-description{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:60px;

    margin-top:70px;

    margin-bottom:180px;

}

.description-item h3{

    font-family:'Playfair Display',serif;

    font-size:28px;

    font-style:italic;

    font-weight:500;

    margin-bottom:18px;

}

.description-item p{

    font-size:17px;

    line-height:1.9;

    color:rgba(255,255,255,.68);

}

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

.mobile-showcase{

    display:flex;

    justify-content:center;

    align-items:flex-end;

    gap:70px;

}

.phone{

    width:280px;

    border-radius:40px;

    overflow:hidden;

    border:1px solid rgba(255,255,255,.08);

    background:#18181d;

    box-shadow:
        0 35px 70px rgba(0,0,0,.4);

    transition:
        transform .45s ease,
        box-shadow .45s ease;

}

.phone:first-child{

    transform:translateY(-35px);

}


.phone img{

    width:100%;

    display:block;

}

/* ======================================================
   RESPONSIVE
====================================================== */

@media(max-width:1100px){

    .showcase-header h2{

        font-size:54px;

    }

    .showcase-description{

        grid-template-columns:1fr;

        gap:40px;

    }

    .mobile-showcase{

        flex-direction:column;

        align-items:center;

    }

    .phone:first-child{

        transform:none;

    }

}

@media(max-width:768px){

    .pm-showcase{

        padding:160px 8%;

    }

    .showcase-header h2{

        font-size:42px;

    }

    .phone{

        width:230px;

    }

}

/* ======================================================
   RESULTS
====================================================== */

.pm-results{

    position:relative;
    overflow:hidden;

    padding:220px 8%;

}

/*======================================================
RESULTS BACKGROUND
======================================================*/

.results-bg{

    position:absolute;

    inset:0;

    overflow:hidden;

    pointer-events:none;

    z-index:0;

}

/* ======================================================
   RESULTS — MOVING BACKGROUND TEXT
====================================================== */

.results-outline{
    position:absolute;

    top:20px;
    left:-120px;

    margin:0;

    font-family:'Playfair Display', serif;
    font-style:italic;
    font-weight:700;

    font-size:360px;
    line-height:.85;
    letter-spacing:-6px;

    color:rgba(255,255,255,.03);

    white-space:nowrap;

    pointer-events:none;
    user-select:none;

    will-change:transform;
}

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

.results-header{

    position:relative;

    z-index:2;

    max-width:700px;

    margin-bottom:100px;

}

.results-header h2{

    margin:24px 0 22px;

    font-family:'Playfair Display',serif;

    font-style:italic;

    font-weight:500;

    font-size:72px;

    line-height:1;

    letter-spacing:-2px;

    color:#fff;

}

.results-header p{

    max-width:520px;

    font-size:18px;

    line-height:1.8;

    color:rgba(255,255,255,.65);

}

/* PERFORMANCE FIGURES DISCLAIMER */

.pm-results .performance-disclaimer {
    position: relative;
    z-index: 2;
    max-width: 560px;
    margin: 80px auto 0;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    line-height: 1.7;
    text-align: center;
    color: rgba(255, 255, 255, .38);
}

@media (max-width: 600px) {
    .pm-results .performance-disclaimer {
        max-width: 320px;
        margin-top: 55px;
        font-size: 11px;
    }
}

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

.results-grid{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:90px 140px;

}

.result-item{

    display:flex;

    flex-direction:column;

    align-items:flex-start;

}

.result-item h3{

    font-family:'Inter',sans-serif;
    font-size:80px;
    font-weight:700;
    line-height:.95;
    letter-spacing:-4px;
    color:#fff;

}

.result-item .count{

    display:inline-block !important;

    font-size:80px !important;

    font-family:'Inter',sans-serif !important;

    font-weight:700 !important;

    line-height:.95 !important;

    letter-spacing:-4px !important;

    color:#fff !important;

}

.result-item span:last-child{

    font-size:16px;

    font-weight:500;

    letter-spacing:.3px;

    color:rgba(255,255,255,.55);

}

/* ======================================================
   RESPONSIVE
====================================================== */

@media(max-width:1000px){

    .results-grid{

        grid-template-columns:1fr;

        gap:70px;

    }

    .results-header h2{

        font-size:54px;

    }

    .result-item h3{

        font-size:62px;

    }

}

@media(max-width:768px){

    .pm-results{

        padding:160px 8%;

    }

    .results-bg-text{

        font-size:150px;

    }

    .results-header h2{

        font-size:46px;

    }

    .results-header p{

        font-size:16px;

    }

}

/* ======================================================
   TESTIMONIAL
====================================================== */

.pm-testimonial{
    padding:220px 8%;
}

.pm-testimonial-inner{
    max-width:1100px;
}

.pm-testimonial blockquote{
    font-family:'Playfair Display',serif;
    font-style:italic;
    font-weight:400;

    font-size:48px;
    line-height:1.45;

    margin:35px 0 50px;
}

.pm-client h4{
    font-size:22px;

    margin-bottom:8px;
}

.pm-client span{
    font-size:12px;

    letter-spacing:2px;
    text-transform:uppercase;

    color:rgba(255,255,255,.45);
}

/* ======================================================
   FINAL CTA
====================================================== */

.pm-cta{

    position:relative;

    overflow:hidden;

    padding:240px 8%;

    text-align:center;

}

.cta-glow{

    position:absolute;

    left:50%;
    top:50%;

    width:750px;
    height:750px;

    transform:translate(-50%,-50%);

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.12) 0%,
            rgba(255,255,255,.08) 20%,
            rgba(255,255,255,.04) 40%,
            rgba(255,255,255,.015) 60%,
            transparent 80%
        );

    filter:blur(40px);

    pointer-events:none;

    z-index:0;

}

.pm-cta-inner{

    position:relative;

    z-index:2;

    max-width:900px;

    margin:auto;

}

.pm-cta .section-label{

    display:inline-block;

    margin-bottom:24px;

    font-size:12px;

    letter-spacing:3px;

    opacity:.45;

}

.pm-cta h2{

    font-family:'Playfair Display',serif;

    font-style:italic;

    font-weight:500;

    font-size:92px;

    line-height:.95;

    letter-spacing:-3px;

    margin-bottom:34px;

    color:#fff;

}

.pm-cta p{

    max-width:620px;

    margin:0 auto 55px;

    font-size:18px;

    line-height:1.9;

    color:rgba(255,255,255,.65);

}

.pm-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    height:62px;

    padding:0 36px;

    border-radius:999px;

    border:1px solid rgba(255,255,255,.14);

    color:#fff;

    text-decoration:none;

    transition:.4s ease;

}

.pm-btn:hover{

    background:#fff;

    color:#151518;

    transform:translateY(-4px);

    box-shadow:
        0 20px 40px rgba(255,255,255,.12);

}

/* ======================================================
   CTA GLOW
====================================================== */

@keyframes ctaGlow{

    0%{

        transform:translate(-50%,-50%) scale(1);

        opacity:.8;

    }

    50%{

        transform:translate(-50%,-50%) scale(1.12);

        opacity:1;

    }

    100%{

        transform:translate(-50%,-50%) scale(1);

        opacity:.8;

    }

}

/* ======================================================
   IPHONE
   0 — 600px
====================================================== */

@media (max-width:600px){

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

    .pm-hero{
        min-height:100svh;
        padding:140px 8% 120px;
        display:flex;
        align-items:center;
    }

    .pm-hero-content{
        width:100%;
        max-width:100%;
    }

    .pm-label{
        margin-bottom:20px;
        font-size:10px;
        letter-spacing:3px;
    }

    .pm-hero h1{
        font-size:56px;
        line-height:.98;
        letter-spacing:-1.5px;
        margin-bottom:18px;
    }

    .pm-hero h2{
        font-size:30px;
        line-height:1.05;
        margin-bottom:24px;
    }

    .pm-hero p{
        max-width:100%;
        font-size:16px;
        line-height:1.8;
    }


    /* ================= SNAPSHOT ================= */

    .pm-snapshot{
        padding:80px 8%;
    }

    .pm-snapshot-grid{
        grid-template-columns:1fr;
        gap:0;
        padding:0;
    }

    .pm-snapshot-item{
        padding:28px 0;
        border-bottom:1px solid rgba(255,255,255,.08);
    }

    .pm-snapshot-item:last-child{
        border-bottom:none;
    }

    .pm-snapshot-item span{
        margin-bottom:10px;
        font-size:10px;
        letter-spacing:2.5px;
    }

    .pm-value{
        font-size:19px;
        line-height:1.6;
        color:#fff;
    }


    /* ================= STORY ================= */

    .pm-story{
        padding:150px 8%;
    }

    .story-row{
        grid-template-columns:1fr;
        gap:50px;
    }

    .strategy-row{
        margin-top:70px;
    }

    .story-content{
        max-width:100%;
    }

    .story-content h2{
        font-size:42px;
        line-height:1;
        letter-spacing:-1px;
        margin:18px 0 28px;
    }

    .story-content p{
        font-size:16px;
        line-height:1.8;
        margin-bottom:20px;
    }

    .story-image{
        aspect-ratio:1 / 1;
        border-radius:24px;
    }

    .story-connector{
        display:none;
    }

    .strategy-list{
        gap:28px;
        margin-top:32px;
    }

    .strategy-item{
        flex-direction:row;
        align-items:flex-start;
        gap:14px;
    }

    .strategy-number{
        width:9px;
        height:9px;
        min-width:9px;
        margin-top:9px;
    }

    .strategy-text h3{
        font-size:24px;
        margin-bottom:7px;
    }

    .strategy-text p{
        font-size:15px;
        line-height:1.75;
    }


    /* ================= SHOWCASE ================= */

    .pm-showcase{
        padding:150px 8%;
    }

    .showcase-header{
        max-width:100%;
        margin:0 auto 80px;
    }

    .showcase-header h2{
        font-size:42px;
        line-height:1;
        letter-spacing:-1px;
        margin:18px 0 22px;
    }

    .showcase-header p{
        font-size:16px;
        line-height:1.8;
    }

    .browser-window{
        border-radius:20px;
    }

    .browser-top{
        position:relative;
        height:48px;
        padding:0 16px;
    }

    .browser-controls{
        gap:7px;
    }

    .browser-btn{
        width:12px;
        height:12px;
    }

    .browser-btn svg{
        width:8px;
        height:8px;
    }

    .browser-address{
        font-size:9px;
        padding:6px 11px;
        gap:5px;
        max-width:55%;
        white-space:nowrap;
        overflow:hidden;
    }

    .lock-icon{
        width:10px;
        height:10px;
        flex-shrink:0;
    }

    .showcase-description{
        grid-template-columns:1fr;
        gap:35px;
        margin-top:55px;
        margin-bottom:100px;
    }

    .description-item h3{
        font-size:24px;
        margin-bottom:12px;
    }

    .description-item p{
        font-size:15px;
        line-height:1.8;
    }

    .mobile-showcase{
        flex-direction:column;
        align-items:center;
        gap:30px;
    }

    .phone{
        width:230px;
        max-width:100%;
        border-radius:32px;
    }

    .phone:first-child{
        transform:none;
    }


    /* ================= RESULTS ================= */

    .pm-results{
        padding:150px 8%;
    }


    /* ================= MOVING BACKGROUND TEXT ================= */

.results-outline{
    top:20px;
    left:-100px;

    font-family:'Playfair Display', serif;
    font-style:italic;
    font-weight:500;

    font-size:220px;
    line-height:.85;
    letter-spacing:0;

    color:rgba(255,255,255,.03);

    -webkit-text-stroke:0;
    text-shadow:none;
    filter:none;

    pointer-events:none;
    user-select:none;
    will-change:transform;
}


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

    .results-header{
        max-width:100%;
        margin-bottom:70px;
    }

    .results-header h2{
        font-size:46px;
        line-height:1;
        letter-spacing:-1px;
    }

    .results-header p{
        font-size:16px;
        line-height:1.8;
    }


    /* ================= RESULTS GRID ================= */

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

    .result-item h3{
        font-size:62px;
        letter-spacing:-3px;
    }

    .result-item .count{
        font-size:62px !important;
        letter-spacing:-3px !important;
    }

    .result-item span:last-child{
        font-size:14px;
    }


    /* ================= TESTIMONIAL ================= */

    .pm-testimonial{
        padding:150px 8%;
    }

    .pm-testimonial-inner{
        max-width:100%;
    }

    .pm-testimonial blockquote{
        font-size:30px;
        line-height:1.4;
        margin:28px 0 40px;
    }

    .pm-client h4{
        font-size:20px;
    }

    .pm-client span{
        font-size:10px;
        letter-spacing:1.5px;
    }


    /* ================= CTA ================= */

    .pm-cta{
        padding:180px 8%;
    }

    .cta-glow{
        width:500px;
        height:500px;
    }

    .pm-cta h2{
        font-size:48px;
        line-height:.98;
        letter-spacing:-1.5px;
    }

    .pm-cta p{
        font-size:16px;
        line-height:1.8;
        margin-bottom:40px;
    }

    .pm-btn{
        height:58px;
        padding:0 30px;
        font-size:14px;
    }

}


/* ======================================================
   IPAD PRO PORTRAIT
   601 — 1024px
====================================================== */

@media (min-width:601px) and (max-width:1024px){

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

    .pm-hero{
        min-height:84svh;
        padding:180px 8% 150px;
        display:flex;
        align-items:center;
    }

    .pm-hero-content{
        max-width:900px;
    }

    .pm-label{
        margin-bottom:25px;
        font-size:11px;
        letter-spacing:3.5px;
    }

    .pm-hero h1{
        font-size:82px;
        line-height:.96;
        letter-spacing:-2px;
    }

    .pm-hero h2{
        font-size:40px;
        line-height:1.05;
        margin-bottom:28px;
    }

    .pm-hero p{
        max-width:680px;
        font-size:18px;
        line-height:1.85;
    }


    /* ================= SNAPSHOT ================= */

    .pm-snapshot{
        padding:100px 8%;
    }

    .pm-snapshot-grid{
        grid-template-columns:1fr 1fr;
        gap:0;
        padding:0;
    }

    .pm-snapshot-item{
        padding:35px 25px 35px 0;
        border-bottom:1px solid rgba(255,255,255,.08);
    }

    .pm-snapshot-item:nth-child(2n){
        padding-left:25px;
        padding-right:0;
        border-left:1px solid rgba(255,255,255,.08);
    }

    .pm-snapshot-item:nth-child(3),
    .pm-snapshot-item:nth-child(4){
        border-bottom:none;
    }

    .pm-snapshot-item span{
        font-size:10px;
        letter-spacing:2.5px;
        margin-bottom:12px;
    }

    .pm-value{
        font-size:20px;
        line-height:1.6;
    }


    /* ================= STORY ================= */

    .pm-story{
        padding:180px 8%;
    }

    .story-row{
        grid-template-columns:1fr;
        gap:70px;
    }

    .strategy-row{
        margin-top:90px;
    }

    .story-content{
        max-width:100%;
    }

    .story-content h2{
        font-size:56px;
        line-height:1;
        letter-spacing:-1.5px;
    }

    .story-content p{
        font-size:17px;
        line-height:1.85;
    }

    .story-image{
        aspect-ratio:1 / 1;
        border-radius:28px;
    }

    .story-connector{
        display:none;
    }

    .strategy-list{
        gap:30px;
    }

    .strategy-text h3{
        font-size:27px;
    }

    .strategy-text p{
        font-size:16px;
        line-height:1.8;
    }


    /* ================= SHOWCASE ================= */

    .pm-showcase{
        padding:190px 8%;
    }

    .showcase-header{
        margin-bottom:100px;
    }

    .showcase-header h2{
        font-size:54px;
        line-height:1;
    }

    .showcase-header p{
        font-size:17px;
        line-height:1.85;
    }

    .browser-top{
        position:relative;
    }

    .showcase-description{
        grid-template-columns:1fr;
        gap:40px;
        margin-top:65px;
        margin-bottom:120px;
    }

    .description-item h3{
        font-size:26px;
    }

    .description-item p{
        font-size:16px;
        line-height:1.85;
    }

    .mobile-showcase{
        flex-direction:row;
        justify-content:center;
        align-items:flex-end;
        gap:45px;
    }

    .phone{
        width:260px;
    }

    .phone:first-child{
        transform:translateY(-25px);
    }


    /* ================= RESULTS ================= */

    .pm-results{
        padding:180px 8%;
    }

    .results-outline{
        top:60px;
        left:-90px;
        font-size:270px;
    }

    .results-header{
        max-width:700px;
        margin-bottom:90px;
    }

    .results-header h2{
        font-size:58px;
    }

    .results-header p{
        font-size:17px;
    }

    .results-grid{
        grid-template-columns:1fr 1fr;
        gap:75px 60px;
    }

    .result-item h3{
        font-size:72px;
        letter-spacing:-4px;
    }

    .result-item .count{
        font-size:72px !important;
        letter-spacing:-4px !important;
    }

    .result-item span:last-child{
        font-size:15px;
    }


    /* ================= TESTIMONIAL ================= */

    .pm-testimonial{
        padding:180px 8%;
    }

    .pm-testimonial blockquote{
        font-size:40px;
        line-height:1.45;
    }


    /* ================= CTA ================= */

    .pm-cta{
        padding:200px 8%;
    }

    .pm-cta h2{
        font-size:72px;
    }

}


/* ======================================================
   IPAD PRO LANDSCAPE
   1025 — 1400px
====================================================== */

@media (min-width:1025px) and (max-width:1400px){

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

    .pm-hero{
        min-height:100svh;
        padding:220px 8% 180px;
        display:flex;
        align-items:center;
    }

    .pm-hero-content{
        max-width:1050px;
    }

    .pm-label{
        font-size:11px;
        letter-spacing:3.5px;
        margin-bottom:28px;
    }

    .pm-hero h1{
        font-size:80px;
        line-height:.96;
        letter-spacing:-2px;
    }

    .pm-hero h2{
        font-size:44px;
        line-height:1.05;
        margin-bottom:30px;
    }

    .pm-hero p{
        max-width:700px;
        font-size:19px;
        line-height:1.85;
    }


    /* ================= SNAPSHOT ================= */

    .pm-snapshot{
        padding:110px 8%;
    }

    .pm-snapshot-grid{
        grid-template-columns:repeat(4,1fr);
        gap:40px;
        padding:55px 0;
    }

    .pm-snapshot-item span{
        font-size:10px;
        letter-spacing:2.5px;
    }

    .pm-value{
        font-size:19px;
        line-height:1.55;
    }


    /* ================= STORY ================= */

    .pm-story{
        padding:200px 8%;
    }

    .story-row{
        grid-template-columns:1fr 1fr;
        gap:65px;
    }

    .strategy-row{
        margin-top:40px;
    }

    .story-content{
        max-width:100%;
    }

    .story-content h2{
        font-size:58px;
        line-height:1;
        letter-spacing:-1.5px;
    }

    .story-content p{
        font-size:17px;
        line-height:1.85;
    }

    .story-image{
        aspect-ratio:1 / 1;
        border-radius:28px;
    }

    .strategy-list{
        gap:25px;
    }

    .strategy-text h3{
        font-size:26px;
    }

    .strategy-text p{
        font-size:15px;
        line-height:1.75;
    }


    /* ================= SHOWCASE ================= */

    .pm-showcase{
        padding:200px 8%;
    }

    .showcase-header{
        margin-bottom:120px;
    }

    .showcase-header h2{
        font-size:60px;
    }

    .showcase-header p{
        font-size:17px;
    }

    .browser-top{
        position:relative;
    }

    .showcase-description{
        grid-template-columns:repeat(3,1fr);
        gap:35px;
        margin-top:65px;
        margin-bottom:140px;
    }

    .description-item h3{
        font-size:26px;
    }

    .description-item p{
        font-size:15px;
        line-height:1.8;
    }

    .mobile-showcase{
        flex-direction:row;
        justify-content:center;
        gap:55px;
    }

    .phone{
        width:260px;
    }

    .phone:first-child{
        transform:translateY(-30px);
    }


    /* ================= RESULTS ================= */

    .pm-results{
        padding:200px 8%;
    }

    .results-outline{
        top:40px;
        left:-100px;
        font-size:320px;
    }

    .results-header{
        max-width:700px;
        margin-bottom:100px;
    }

    .results-header h2{
        font-size:64px;
    }

    .results-header p{
        font-size:17px;
    }

    .results-grid{
        grid-template-columns:1fr 1fr;
        gap:80px 110px;
    }

    .result-item h3{
        font-size:76px;
    }

    .result-item .count{
        font-size:76px !important;
    }


    /* ================= TESTIMONIAL ================= */

    .pm-testimonial{
        padding:200px 8%;
    }

    .pm-testimonial blockquote{
        font-size:44px;
    }


    /* ================= CTA ================= */

    .pm-cta{
        padding:220px 8%;
    }

    .pm-cta h2{
        font-size:80px;
    }

}

/* ======================================================
   IPAD PRO PORTRAIT — SNAPSHOT
====================================================== */

@media (min-width:601px) and (max-width:1024px){

    .pm-snapshot{
        padding:100px 8%;
    }

    .pm-snapshot-grid{
        grid-template-columns:repeat(4,1fr);
        gap:28px;
        padding:50px 0;
        border-top:1px solid rgba(255,255,255,.08);
        border-bottom:1px solid rgba(255,255,255,.08);
    }

    .pm-snapshot-item{
        padding:0;
        border:none !important;
    }

    .pm-snapshot-item span{
        margin-bottom:14px;
        font-size:9px;
        letter-spacing:2.5px;
    }

    .pm-value{
        font-size:17px;
        line-height:1.55;
    }

}

/* ======================================================
   MACBOOK / LAPTOP — RESULTS BACKGROUND TEXT
   1401px+ / 900px height and below
====================================================== */

@media (min-width:1401px) and (max-height:900px){

    .results-outline{
        top:20px;
        left:-120px;

        font-family:'Playfair Display', serif;
        font-style:italic;
        font-weight:500;

        font-size:300px;
        line-height:.85;
        letter-spacing:-6px;

        color:rgba(255,255,255,.03);

        -webkit-text-stroke:0;
        text-shadow:none;
        filter:none;

        white-space:nowrap;
        pointer-events:none;
        user-select:none;

        will-change:transform;

        transition:none;
    }

}

/* =========================================
   PREMIUM MOVERS NAVBAR BACK BUTTON
========================================= */

.navbar .logo {
    display: flex;
    align-items: center;
    gap: 14px;
}

.pm-nav-back {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    box-sizing: border-box;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0;
    margin: 0;
    line-height: 0;

    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 50%;

    color: #fff;
    text-decoration: none;

    transition:
        background .3s ease,
        border-color .3s ease,
        transform .3s ease;
}

.pm-nav-back svg {
    display: block;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transform: translateX(1px);
    transition: transform .3s ease;
}

.pm-nav-back:hover {
    background: #fff;
    color: #151518;
    border-color: #fff;
}

.pm-nav-back:hover svg {
    transform: translateX(-3px);
}

/* SCROLLED NAVBAR */
.navbar.scrolled .pm-nav-back {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
}

.navbar.scrolled .pm-nav-back svg {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
}

/* IPHONE */
@media (max-width: 600px) {
    .navbar .logo {
        gap: 9px;
    }

    .pm-nav-back {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
    }

    .pm-nav-back svg {
        width: 20px;
        height: 20px;
        flex-basis: 20px;
    }

    .navbar.scrolled .pm-nav-back {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }
}