/* =====================================================================
   HMV Courier — Company Page
   Implemented 1:1 from Figma "MacBook Pro 16 - 16" node 107:1716
   (1728×8155) via the official Figma MCP. Loaded after landing.css.
   ===================================================================== */

/* ---------------- Hero (107:2113 video + 107:1767) ---------------- */
.cp-hero{
    position:relative; overflow:hidden; color:#fff;
    height:clamp(560px, 56.25vw, 972px);
    margin-top:calc(-1 * 98px);
}
.cp-hero-media, .cp-hero-media video{
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.cp-hero-overlay{
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(0,10,40,.25) 0%, rgba(0,20,80,.6) 100%);
}
.cp-hero-inner{ position:relative; height:100%; }
.cp-hero-copy{ position:absolute; left:0; bottom:8.2%; }
.cp-hero-copy h1{
    font-family:var(--serif); font-weight:900;
    font-size:clamp(38px, 4.63vw, 80px); line-height:0.9; max-width:1095px;
}
.cp-hero-copy p{
    margin-top:24px; font-weight:300; font-size:var(--fs-body-24);
    line-height:1; max-width:772px;
}
@media (max-width: 900px){
    .cp-hero{ height:auto; min-height:80svh; }
    .cp-hero-inner{ display:flex; align-items:flex-end; padding:140px 0 48px;
                    height:auto; min-height:80svh; }
    .cp-hero-copy{ position:static; }
}

/* ---------------- Mission / Vision cards (110:2153 / 108:2134) ---------------- */
.cp-mv{ padding-top:clamp(48px, 4.5vw, 77px); }
.cp-mv-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.cp-mv-card{
    border:1px solid var(--neutral-200); border-radius:24px; overflow:hidden;
    background:#fff; display:flex; flex-direction:column;
}
.cp-mv-img{ height:clamp(360px, 41.2vw, 712px); }
.cp-mv-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.cp-mv-body{ padding:40px 24px; }
.cp-badge{
    display:inline-block; padding:16px 24px; border-radius:8px;
    background:var(--primary-50); border:1px solid var(--primary-200);
    font-weight:500; font-size:20px; line-height:1; color:var(--primary);
    text-transform:uppercase; letter-spacing:-0.02em;
}
.cp-mv-body h2{
    margin-top:40px;
    font-weight:600; font-size:clamp(32px, 3.7vw, 64px); line-height:0.9;
    color:var(--primary); max-width:711px;
}
.cp-mv-body p{
    margin-top:24px; font-weight:300; font-size:var(--fs-body-24);
    line-height:1.15; color:#000; max-width:724px;
}
@media (max-width: 980px){ .cp-mv-grid{ grid-template-columns:1fr; } }

/* ---------------- More Than Packages split (107:2107) ---------------- */
.cp-more{ padding-top:clamp(64px, 7.4vw, 128px); }
.cp-more-grid{
    display:grid; grid-template-columns:1fr clamp(320px, 44.7vw, 772px);
    gap:24px; align-items:center;
}
.cp-more-copy h2{
    font-weight:600; font-size:clamp(32px, 3.7vw, 64px); line-height:0.9;
    color:var(--primary); max-width:712px;
}
.cp-more-copy p{
    margin-top:40px; font-weight:300; font-size:var(--fs-body-24);
    line-height:1.15; color:#000; max-width:772px;
}
.cp-more-img{ border-radius:16px; width:100%; }
@media (max-width: 980px){ .cp-more-grid{ grid-template-columns:1fr; } }

/* ---------------- The Way We Move — values (110:2154) ---------------- */
.cp-values{ padding-top:clamp(56px, 7vw, 120px); }
.cp-values h2{
    font-weight:600; font-size:clamp(30px, 3.24vw, 56px); line-height:0.9;
    color:var(--primary); text-align:center;
}
.cp-values-grid{
    margin-top:clamp(40px, 4.5vw, 74px);
    display:grid; grid-template-columns:repeat(4, 1fr); gap:24px;
}
.cp-value{
    border-radius:16px; padding:24px;
    min-height:clamp(260px, 20.25vw, 350px);
    border:1px solid transparent;
}
.cp-value h3{
    font-weight:500; font-size:clamp(26px, 2.78vw, 48px); line-height:1;
    max-width:330px;
}
.cp-value p{
    margin-top:40px; font-weight:300; font-size:var(--fs-body-24);
    line-height:1; color:#000; max-width:335px;
}
.cp-value-blue   { background:var(--primary-50); border-color:var(--primary-200); }
.cp-value-blue h3   { color:var(--primary); }
.cp-value-neutral{ background:#FAFAFA; border-color:var(--neutral-200); }
.cp-value-neutral h3{ color:#404040; }
.cp-value-green  { background:#ECFDF5; border-color:#A4F4CF; }
.cp-value-green h3  { color:#009966; }
.cp-value-amber  { background:#FFFBEB; border-color:#FEE685; }
.cp-value-amber h3  { color:#BB4D00; }
@media (max-width: 1100px){ .cp-values-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width: 640px){ .cp-values-grid{ grid-template-columns:1fr; } }

/* ---------------- Network in Motion — metrics (110:2183/2170) ---------------- */
.cp-motion{ padding-top:clamp(56px, 7vw, 120px); }
.cp-motion h2{
    font-weight:600; font-size:clamp(30px, 3.24vw, 56px); line-height:0.9;
    color:var(--primary); text-align:center;
}
.cp-metrics{
    margin-top:clamp(40px, 4.6vw, 78px);
    display:flex; justify-content:space-between; align-items:center;
    gap:clamp(16px, 2vw, 36px);
    background:rgba(255,255,255,.1);
    -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
    padding:clamp(20px, 2.3vw, 40px) clamp(24px, 4.63vw, 80px);
    overflow-x:auto;
}
.cp-metric{ display:flex; flex-direction:column; align-items:center; }
.cp-metric b{
    font-family:var(--serif); font-weight:900; color:#000;
    font-size:clamp(36px, 4.63vw, 80px); line-height:0.9; white-space:nowrap;
}
.cp-metric span{
    font-weight:400; color:#000;
    font-size:clamp(15px, 1.68vw, 29px); line-height:1; white-space:nowrap;
}

/* ---------------- Hub network map (110:2187 — same as landing) ---------------- */
.cp-network{ position:relative; padding-top:clamp(56px, 6.9vw, 120px); overflow:hidden; }
.cp-network h2{
    font-weight:600; font-size:var(--fs-section-80); line-height:0.9;
    color:var(--primary); text-align:center;
}

/* ---------------- People carousel (110:2232) ---------------- */
.cp-people{ padding-top:clamp(56px, 7vw, 120px); }
.cp-people h2{
    font-weight:600; font-size:clamp(30px, 3.24vw, 56px); line-height:0.9;
    color:var(--primary); text-align:center;
}
.cp-people .cp-people-sub{
    margin-top:24px; font-weight:300; font-size:var(--fs-body-24);
    line-height:1; color:#000; text-align:center;
}
.cp-people-track{
    margin-top:clamp(40px, 4.6vw, 80px);
    display:flex; gap:24px; overflow-x:auto;
    scroll-snap-type:x mandatory; scrollbar-width:none;
}
.cp-people-track::-webkit-scrollbar{ display:none; }
.cp-people-track img{
    flex:0 0 min(639px, 84%); height:clamp(280px, 24.7vw, 427px);
    object-fit:cover; border-radius:16px; scroll-snap-align:start;
}
.cp-people-nav{
    margin-top:40px; display:flex; gap:8px; align-items:center; justify-content:center;
}
.cp-people-nav button{
    width:56px; height:56px; border-radius:50%;
    border:1px solid var(--neutral-200); background:#fff;
    display:flex; align-items:center; justify-content:center;
    transition:background .2s ease;
}
.cp-people-nav button:hover{ background:var(--primary-50); }
.cp-people-nav button img{ width:24px; height:24px; }
.cp-people-nav .cp-flip{ transform:scaleX(-1); }
.cp-dots{ display:flex; gap:4px; margin:0 8px; }
.cp-dots i{ width:8px; height:8px; border-radius:4px; background:#D9D9D9; }
.cp-dots i.active{ width:34px; background:var(--primary); }

/* ---------------- Partners (110:2286) ---------------- */
.cp-partners{ padding-top:clamp(56px, 7vw, 120px); }
.cp-partners-grid{
    display:grid; grid-template-columns:1fr clamp(320px, 65.4vw, 1130px);
    gap:24px; align-items:center;
}
.cp-partners-copy h2{
    font-weight:600; font-size:clamp(32px, 3.7vw, 64px); line-height:0.9;
    color:var(--primary); max-width:374px;
}
.cp-partners-copy p{
    margin-top:54px; font-weight:300; font-size:var(--fs-body-24);
    line-height:1; color:#000; max-width:410px;
}
.cp-partners-grid img{ width:100%; }
@media (max-width: 980px){ .cp-partners-grid{ grid-template-columns:1fr; } }

/* ---------------- CTA — centered (107:1821) ---------------- */
.cp-cta{ margin-top:clamp(64px, 7vw, 120px); }
.cp-cta .lp-cta-card p{ max-width:902px; font-size:var(--fs-body-24); }
.cp-cta-btns{ margin-top:40px; display:flex; gap:16px; flex-wrap:wrap; justify-content:center;
              position:relative; z-index:1; }
