/* ======================================================
   FROZEN SHOULDER - PREMIUM HEALTHCARE CSS
   PART 1
   GLOBAL + HERO
====================================================== */

:root{

    --primary:#0b6bff;
    --primary-dark:#0856cf;
    --accent:#00b8ff;

    --heading:#0f172a;
    --text:#5f6b7a;

    --bg:#f7fafe;
    --white:#ffffff;

    --border:#e6edf5;

    --radius-sm:12px;
    --radius-md:16px;
    --radius-lg:20px;

    --shadow-sm:0 4px 20px rgba(15,23,42,.05);
    --shadow-md:0 10px 35px rgba(15,23,42,.08);
    --shadow-lg:0 20px 60px rgba(15,23,42,.10);

}

/* ==========================
   RESET
========================== */

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

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

body{
    color:var(--text);
    background:#fff;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}

.froza-shell{
    width:min(1240px,calc(100% - 32px));
    margin:auto;
}

/* ==========================
   GLOBAL TYPOGRAPHY
========================== */

.froza-section-tag,
.froza-chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:8px 14px;

    border-radius:999px;

    background:#eaf4ff;

    color:var(--primary);

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

    letter-spacing:.3px;
    text-transform:uppercase;
}

.froza-section-tag{
    margin-bottom:16px;
}

h1,h2,h3{
    color:var(--heading);
}

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

.froza-hero{

    padding:60px 0;

    background:
    linear-gradient(
    180deg,
    #f9fcff 0%,
    #f2f8ff 100%
    );

    overflow:visible;
}

.froza-hero-grid{

    display:grid;

    grid-template-columns:
    1.05fr
    .95fr;

    gap:60px;

    align-items:center;
}

.froza-hero-content{
    position:relative;
    z-index:2;
}

.froza-chip{
    margin-bottom:18px;
}

.froza-hero h1{

    margin:0 0 18px;

    font-size:56px;

    line-height:1.08;

    font-weight:800;

    letter-spacing:-1.5px;

    max-width:900px;
}

.froza-intro{

    margin:0 0 16px;

    font-size:16px;

    line-height:1.9;

    color:var(--text);
}

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

.froza-action-row{

    display:flex;

    gap:14px;

    flex-wrap:wrap;

    margin-top:26px;
}

.froza-btn-primary,
.froza-btn-secondary{

    min-height:54px;

    padding:0 22px;

    border-radius:12px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    font-size:15px;

    font-weight:700;

    transition:.25s ease;
}

.froza-btn-primary{

    color:#fff;

    background:
    linear-gradient(
    135deg,
    var(--primary),
    var(--accent)
    );

    box-shadow:
    0 10px 30px
    rgba(11,107,255,.18);
}

.froza-btn-primary:hover{
    transform:translateY(-2px);
}

.froza-btn-secondary{

    background:#fff;

    color:var(--heading);

    border:1px solid var(--border);

    box-shadow:var(--shadow-sm);
}

.froza-btn-secondary:hover{
    transform:translateY(-2px);
}

/* ==========================
   TRUST STRIP
========================== */

.froza-trust-strip{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-top:22px;
}

.froza-trust-strip span{

    background:#fff;

    border:1px solid var(--border);

    border-radius:10px;

    padding:10px 14px;

    font-size:13px;

    font-weight:600;

    color:#334155;
}

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

.froza-hero-media{
    position:relative;
}

.froza-hero-media img{

    width:100%;

    border-radius:20px;

    box-shadow:var(--shadow-lg);
}

.froza-float-card{

    position:absolute;

    background:#fff;

    border:1px solid var(--border);

    border-radius:16px;

    padding:16px;

    box-shadow:var(--shadow-md);

    max-width:220px;
}

.froza-float-card strong{

    display:block;

    margin-bottom:6px;

    color:var(--heading);

    font-size:15px;
}

.froza-float-card span{

    font-size:13px;

    line-height:1.6;

    color:var(--text);
}

.froza-card-a{

    left:-20px;
    bottom:20px;
}

.froza-card-b{

    right:-20px;
    top:20px;
}

/* ==========================
   TABLET
========================== */

@media(max-width:1024px){

    .froza-hero-grid{
        grid-template-columns:1fr;
        gap:40px;
    }

    .froza-hero h1{
        font-size:44px;
    }

    .froza-card-a,
    .froza-card-b{
        display:none;
    }
}

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

@media(max-width:768px){

    .froza-shell{
        width:min(100% - 24px,1240px);
    }

    .froza-hero{
        padding:35px 0;
    }

    .froza-hero h1{

        font-size:32px;

        line-height:1.15;

        letter-spacing:-0.5px;
    }

    .froza-intro{

        font-size:15px;

        line-height:1.8;
    }

    .froza-action-row{
        flex-direction:column;
    }

    .froza-btn-primary,
    .froza-btn-secondary{
        width:100%;
    }

    .froza-trust-strip{
        gap:8px;
    }

    .froza-trust-strip span{
        font-size:12px;
    }
}


/* ======================================================
   FROZEN SHOULDER PREMIUM CSS
   PART 2
====================================================== */

/* ==========================
   SECTION SPACING
========================== */

.froza-warning-zone,
.froza-overview,
.froza-stage-zone,
.froza-cause-zone,
.froza-rehab-zone,
.froza-method-zone{
    padding:80px 0;
}

/* ==========================
   SECTION HEADERS
========================== */

.froza-warning-head,
.froza-stage-head,
.froza-cause-head,
.froza-method-head{

    max-width:850px;

    margin:0 auto 50px;

    text-align:center;
}

.froza-warning-head h2,
.froza-stage-head h2,
.froza-cause-head h2,
.froza-method-head h2,
.froza-overview-content h2,
.froza-rehab-content h2{

    margin:0 0 14px;

    font-size:42px;

    line-height:1.15;

    font-weight:800;

    color:var(--heading);

    letter-spacing:-1px;
}

.froza-warning-head p,
.froza-stage-head p,
.froza-cause-head p,
.froza-overview-content p,
.froza-rehab-content p{

    color:var(--text);

    line-height:1.9;

    font-size:16px;
}

/* ==========================
   SYMPTOMS CARDS
========================== */

.froza-warning-grid{

    display:grid;

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

    gap:20px;
}

.froza-warning-card{

    background:#fff;

    border:1px solid var(--border);

    border-radius:18px;

    padding:24px;

    box-shadow:var(--shadow-sm);

    transition:.25s ease;
}

.froza-warning-card:hover{

    transform:translateY(-4px);

    box-shadow:var(--shadow-md);
}

.froza-count{

    width:50px;
    height:50px;

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

    border-radius:12px;

    background:var(--primary);

    color:#fff;

    font-size:14px;
    font-weight:800;

    margin-bottom:16px;
}

.froza-warning-card h3{

    font-size:18px;

    margin-bottom:10px;

    color:var(--heading);
}

.froza-warning-card p{

    color:var(--text);

    line-height:1.8;
}

/* ==========================
   OVERVIEW
========================== */

.froza-overview{
    background:#fff;
}

.froza-overview-grid{

    display:grid;

    grid-template-columns:.95fr 1.05fr;

    gap:60px;

    align-items:center;
}

.froza-overview-image img{

    border-radius:20px;

    box-shadow:var(--shadow-lg);
}

.froza-overview-content p{
    margin-bottom:16px;
}

/* ==========================
   STAGES
========================== */

.froza-stage-zone{
    background:#f8fbff;
}

.froza-stage-grid{

    display:grid;

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

    gap:22px;
}

.froza-stage-card{

    background:#fff;

    border-radius:18px;

    padding:28px;

    border:1px solid var(--border);

    box-shadow:var(--shadow-sm);
}

.froza-stage-label{

    display:inline-flex;

    padding:8px 14px;

    border-radius:999px;

    background:#eaf4ff;

    color:var(--primary);

    font-size:12px;

    font-weight:700;

    margin-bottom:16px;
}

.froza-stage-card h3{

    margin-bottom:12px;

    font-size:20px;

    color:var(--heading);
}

.froza-stage-card p{

    color:var(--text);

    line-height:1.8;
}

/* ==========================
   CAUSES
========================== */

.froza-cause-grid{

    display:grid;

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

    gap:22px;
}

.froza-cause-card{

    background:#fff;

    border:1px solid var(--border);

    border-radius:18px;

    padding:28px;

    box-shadow:var(--shadow-sm);

    transition:.25s;
}

.froza-cause-card:hover{

    transform:translateY(-4px);

    box-shadow:var(--shadow-md);
}

.froza-cause-card h3{

    margin-bottom:12px;

    font-size:19px;

    color:var(--heading);
}

.froza-cause-card p{

    color:var(--text);

    line-height:1.8;
}

/* ==========================
   REHAB SECTION
========================== */

.froza-rehab-zone{

    background:#0f172a;
}

.froza-rehab-layout{

    display:grid;

    grid-template-columns:1.05fr .95fr;

    gap:60px;

    align-items:center;
}

.froza-rehab-content .froza-section-tag{

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

    color:#fff;
}

.froza-rehab-content h2{
    color:#fff;
}

.froza-rehab-content p{

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

    margin-bottom:16px;
}

.froza-rehab-image img{

    border-radius:20px;

    box-shadow:
    0 25px 70px
    rgba(0,0,0,.25);
}

/* ==========================
   METHODS
========================== */

.froza-method-zone{
    background:#fff;
}

.froza-method-grid{

    display:grid;

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

    gap:22px;
}

.froza-method-card{

    background:#fff;

    border:1px solid var(--border);

    border-radius:18px;

    padding:26px;

    box-shadow:var(--shadow-sm);

    transition:.25s;
}

.froza-method-card:hover{

    transform:translateY(-4px);

    box-shadow:var(--shadow-md);
}

.froza-method-no{

    width:52px;
    height:52px;

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

    border-radius:12px;

    background:var(--primary);

    color:#fff;

    font-weight:800;

    margin-bottom:16px;
}

.froza-method-card h3{

    font-size:18px;

    margin-bottom:10px;

    color:var(--heading);
}

.froza-method-card p{

    color:var(--text);

    line-height:1.8;
}

/* ==========================
   TABLET
========================== */

@media(max-width:1024px){

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

    .froza-stage-grid{
        grid-template-columns:1fr;
    }

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

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

    .froza-overview-grid,
    .froza-rehab-layout{
        grid-template-columns:1fr;
        gap:40px;
    }

    .froza-warning-head h2,
    .froza-stage-head h2,
    .froza-cause-head h2,
    .froza-method-head h2,
    .froza-overview-content h2,
    .froza-rehab-content h2{
        font-size:34px;
    }
}

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

@media(max-width:768px){

    .froza-warning-zone,
    .froza-overview,
    .froza-stage-zone,
    .froza-cause-zone,
    .froza-rehab-zone,
    .froza-method-zone{
        padding:55px 0;
    }

    .froza-warning-grid,
    .froza-cause-grid,
    .froza-method-grid{
        grid-template-columns:1fr;
    }

    .froza-warning-head,
    .froza-stage-head,
    .froza-cause-head,
    .froza-method-head{
        margin-bottom:35px;
    }

    .froza-warning-head h2,
    .froza-stage-head h2,
    .froza-cause-head h2,
    .froza-method-head h2,
    .froza-overview-content h2,
    .froza-rehab-content h2{

        font-size:28px;

        line-height:1.2;
    }

    .froza-warning-card,
    .froza-stage-card,
    .froza-cause-card,
    .froza-method-card{
        padding:22px;
    }
}


/* ======================================================
   FROZEN SHOULDER PREMIUM CSS
   PART 3
====================================================== */

/* ==========================
   GOALS SECTION
========================== */

.froza-goals-zone{
    padding:80px 0;
    background:#f8fbff;
}

.froza-goals-head{

    text-align:center;

    max-width:850px;

    margin:0 auto 50px;
}

.froza-goals-head h2{

    font-size:42px;

    line-height:1.15;

    font-weight:800;

    color:var(--heading);
}

.froza-goals-grid{

    display:grid;

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

    gap:20px;
}

.froza-goal-card{

    background:#fff;

    border:1px solid var(--border);

    border-radius:18px;

    padding:24px;

    box-shadow:var(--shadow-sm);

    transition:.25s;
}

.froza-goal-card:hover{

    transform:translateY(-4px);

    box-shadow:var(--shadow-md);
}

.froza-goal-card h3{

    font-size:18px;

    margin-bottom:10px;

    color:var(--heading);
}

.froza-goal-card p{

    color:var(--text);

    line-height:1.8;
}

/* ==========================
   DAILY HABITS
========================== */

.froza-daily-zone{
    padding:80px 0;
    background:#fff;
}

.froza-daily-layout{

    display:grid;

    grid-template-columns:.95fr 1.05fr;

    gap:60px;

    align-items:center;
}

.froza-daily-image img{

    border-radius:20px;

    box-shadow:var(--shadow-lg);
}

.froza-daily-content h2{

    margin:0 0 18px;

    font-size:42px;

    line-height:1.15;

    font-weight:800;

    color:var(--heading);
}

.froza-daily-content p{

    color:var(--text);

    line-height:1.9;
}

.froza-daily-list{

    display:grid;

    gap:16px;

    margin-top:24px;
}

.froza-daily-item{

    background:#f8fbff;

    border:1px solid var(--border);

    border-radius:16px;

    padding:20px;
}

.froza-daily-item h3{

    margin-bottom:8px;

    font-size:17px;

    color:var(--heading);
}

.froza-daily-item p{

    margin:0;

    line-height:1.8;
}

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

.froza-faq-zone{

    padding:80px 0;

    background:#f8fbff;
}

.froza-faq-head{

    text-align:center;

    max-width:850px;

    margin:0 auto 50px;
}

.froza-faq-head h2{

    color:var(--heading);

    font-size:42px;

    line-height:1.15;

    font-weight:800;
}

.froza-faq-wrap{

    max-width:900px;

    margin:auto;
}

.froza-faq-wrap::before{
    display:none;
}

.froza-faq-item{

    display:flex;

    gap:18px;

    margin-bottom:16px;
}

.froza-faq-no{

    width:48px;
    height:48px;

    flex-shrink:0;

    border-radius:12px;

    background:var(--primary);

    color:#fff;

    font-size:14px;
    font-weight:800;

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

.froza-faq-content{

    flex:1;

    background:#fff;

    border:1px solid var(--border);

    border-radius:16px;

    padding:20px;

    box-shadow:var(--shadow-sm);
}

.froza-faq-content h3{

    margin-bottom:8px;

    color:var(--heading);

    font-size:18px;
}

.froza-faq-content p{

    margin:0;

    color:var(--text);

    line-height:1.8;
}

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

.froza-cta-zone{

    padding:0 0 80px;

    background:#fff;
}

.froza-cta-panel{

    background:
    linear-gradient(
    135deg,
    #0b6bff,
    #00b8ff
    );

    border-radius:24px;

    padding:50px;

    overflow:hidden;

    box-shadow:
    0 25px 70px
    rgba(11,107,255,.18);
}

.froza-cta-panel::before,
.froza-cta-panel::after{
    display:none;
}

.froza-cta-tag{

    display:inline-block;

    margin-bottom:14px;

    color:#dff4ff;

    font-size:12px;

    font-weight:700;

    text-transform:uppercase;
}

.froza-cta-content h2{

    color:#fff;

    font-size:46px;

    line-height:1.1;

    margin-bottom:16px;

    font-weight:800;
}

.froza-cta-content p{

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

    line-height:1.9;

    max-width:850px;
}

.froza-cta-points{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

    margin-top:24px;
}

.froza-cta-points span{

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

    border-radius:999px;

    padding:10px 14px;

    color:#fff;

    font-size:13px;

    font-weight:600;
}

/* ==========================
   ROADMAP
========================== */

.froza-roadmap{

    display:grid;

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

    gap:18px;

    margin-top:35px;
}

.froza-road-step{

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

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

    border-radius:16px;

    padding:20px;
}

.froza-road-step strong{

    width:42px;
    height:42px;

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

    border-radius:10px;

    background:#fff;

    color:var(--primary);

    font-weight:800;

    margin-bottom:14px;
}

.froza-road-step h3{

    color:#fff;

    font-size:16px;

    margin-bottom:8px;
}

.froza-road-step p{

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

    font-size:14px;

    line-height:1.7;
}

/* ==========================
   TABLET
========================== */

@media(max-width:1024px){

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

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

    .froza-daily-layout{
        grid-template-columns:1fr;
    }

    .froza-goals-head h2,
    .froza-daily-content h2,
    .froza-faq-head h2,
    .froza-cta-content h2{
        font-size:34px;
    }
}

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

@media(max-width:768px){

    .froza-goals-zone,
    .froza-daily-zone,
    .froza-faq-zone{
        padding:55px 0;
    }

    .froza-goals-grid,
    .froza-roadmap{
        grid-template-columns:1fr;
    }

    .froza-goals-head,
    .froza-faq-head{
        margin-bottom:35px;
    }

    .froza-goals-head h2,
    .froza-daily-content h2,
    .froza-faq-head h2,
    .froza-cta-content h2{

        font-size:28px;

        line-height:1.2;
    }

    .froza-cta-panel{

        padding:28px 22px;

        border-radius:18px;
    }

    .froza-faq-item{

        flex-direction:column;

        gap:10px;
    }

    .froza-faq-no{
        width:42px;
        height:42px;
    }

    .froza-road-step{
        padding:18px;
    }
}