/*
 * Pertecnica Hero — Workforce Solutions
 * Presentation-only redesign. CMS/save contract remains unchanged.
 */

.hcg-hero-section{
    --hero-ink:#151815;
    --hero-text:#505650;
    --hero-muted:#7d827c;
    --hero-green:#2f6b4f;
    --hero-gold:#b28a3a;
    --hero-line:rgba(36,55,43,.15);
    position:relative;
    overflow:hidden;
    padding:64px 0 82px !important;
    background:#fff !important;
    isolation:isolate;
}

/* Keep the architectural background extremely quiet so the photograph stays sharp. */
.hcg-hero-blueprint{
    position:absolute;
    inset:0;
    z-index:-1;
    color:#557061;
    opacity:.07;
    pointer-events:none;
}
.hcg-pencil-drawing{
    position:absolute;
    width:min(900px,68vw);
    height:auto;
    right:-80px;
    top:25px;
    transform:rotate(-1deg);
}
.hcg-blueprint-line{
    position:absolute;
    display:block;
    border-top:1px solid rgba(47,107,79,.18);
}
.hcg-blueprint-line-a{width:28%;left:0;top:23%}
.hcg-blueprint-line-b{width:20%;right:0;top:67%}
.hcg-blueprint-circle{
    position:absolute;
    border:1px solid rgba(47,107,79,.13);
    border-radius:50%;
}
.hcg-blueprint-circle-a{width:180px;height:180px;right:4%;top:12%}
.hcg-blueprint-circle-b{width:74px;height:74px;left:4%;bottom:12%}

.hcg-hero-intro{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1.02fr) minmax(380px,.98fr);
    gap:34px;
    align-items:center;
    min-height:360px;
}
.hcg-hero-copy{
    position:relative;
    z-index:3;
    max-width:680px;
    padding-right:10px;
}
.hcg-hero-rule{
    width:36px;height:2px;margin:0 0 14px;
    background:var(--hero-green)!important;
}
.hcg-hero-eyebrow{
    margin:0 0 12px;
    color:#9b7836;
    font-size:10px;
    line-height:1.4;
    font-weight:600;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.hcg-hero-title{
    max-width:760px;
    margin:0!important;
    color:var(--hero-ink);
    font-size:clamp(40px,4.35vw,62px)!important;
    line-height:1.03!important;
    font-weight:500!important;
    letter-spacing:-.045em;
}
.hcg-hero-description{
    max-width:650px;
    margin-top:20px;
    color:var(--hero-text);
    font-size:15px;
    line-height:1.68;
}
.hcg-hero-description p{margin:0 0 8px}
.hcg-hero-description p:last-child{margin-bottom:0}
.hcg-hero-buttons{
    display:flex;flex-wrap:wrap;gap:10px;margin-top:24px
}
.hcg-hero-buttons .hcg-btn-primary,
.hcg-hero-buttons .hcg-btn-secondary{
    min-height:36px;
}

/* Clean full-colour editorial image. No mask, opacity, blend mode or filter. */
.hcg-hero-art{
    position:relative;
    height:360px;
    display:block;
    overflow:hidden;
    background:#e9eee9;
    border-radius:0;
    box-shadow:0 12px 34px rgba(18,30,22,.08);
}
.hcg-hero-art:before,
.hcg-hero-art:after{
    display:none;
}
.hcg-hero-art picture{
    position:relative;
    display:block;
    width:100%;
    height:100%;
    z-index:2;
}
.hcg-hero-art img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    mix-blend-mode:normal;
    opacity:1;
    filter:none;
    -webkit-mask-image:none;
    mask-image:none;
}
.hcg-hero-art-label{display:none}

/* BUSINESS MODEL */
.hcg-model-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin:46px 0 16px;
    padding-bottom:13px;
    border-bottom:1px solid var(--hero-line);
}
.hcg-model-heading span{
    display:block;margin-bottom:5px;
    color:var(--hero-green);
    font-size:9px;font-weight:700;letter-spacing:.16em;
}
.hcg-model-heading h2{
    margin:0!important;
    color:var(--hero-ink);
    font-size:24px!important;
    line-height:1.2!important;
    font-weight:500!important;
    letter-spacing:-.02em;
}
.hcg-model-index{
    color:var(--hero-muted);
    font-size:9px;
    letter-spacing:.12em;
    white-space:nowrap;
}

.hcg-business-model{
    position:relative;
    min-height:430px;
    display:grid;
    grid-template-columns:repeat(12,1fr);
    grid-template-rows:1fr 1fr;
    gap:18px;
    padding:30px 0 54px;
}
.hcg-model-orbit{
    position:absolute;
    left:50%;top:50%;
    transform:translate(-50%,-50%);
    border:1px dashed rgba(47,107,79,.20);
    border-radius:50%;
    pointer-events:none;
}
.hcg-model-orbit-outer{width:390px;height:390px}
.hcg-model-orbit-inner{width:220px;height:220px;border-style:solid;opacity:.6}

.hcg-model-center{
    position:absolute;
    z-index:3;
    left:50%;top:50%;
    width:320px;height:250px;
    transform:translate(-50%,-50%);
    display:flex;align-items:center;justify-content:center;
    text-align:center;
    background:transparent;
    pointer-events:none;
}
.hcg-model-center-wheel img{
    display:block;
    width:100%;
    height:100%;
    max-width:none;
    max-height:none;
    object-fit:contain;
    object-position:center;
    mix-blend-mode:multiply;
    filter:saturate(.88) contrast(.98);
}

.hcg-model-card{
    position:relative;
    z-index:4;
    padding:19px 20px 20px;
    background:rgba(255,255,255,.91);
    border:1px solid rgba(36,55,43,.14);
    box-shadow:0 8px 24px rgba(24,39,30,.045);
    transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.hcg-model-card:hover{
    transform:translateY(-4px);
    border-color:rgba(47,107,79,.38);
    box-shadow:0 16px 32px rgba(24,39,30,.09);
}
.hcg-model-card-1{grid-column:1 / span 4;grid-row:1}
.hcg-model-card-2{grid-column:9 / span 4;grid-row:1}
.hcg-model-card-3{grid-column:1 / span 4;grid-row:2}
.hcg-model-card-4{grid-column:9 / span 4;grid-row:2}

.hcg-model-center-wheel{
    width:min(320px, 34vw);
    height:min(250px, 27vw);
}

.hcg-model-card-top{
    display:flex;align-items:center;justify-content:space-between;
    margin-bottom:20px
}
.hcg-model-number{
    color:var(--hero-green);
    font-size:11px;font-weight:700;letter-spacing:.08em
}
.hcg-model-type{
    color:#9a9f9a;font-size:7px;letter-spacing:.13em;font-weight:600
}
.hcg-model-card h3{
    max-width:300px;
    margin:0!important;
    color:var(--hero-ink);
    font-size:17px!important;
    line-height:1.25!important;
    font-weight:550!important;
    letter-spacing:-.015em;
}
.hcg-model-card p{
    max-width:330px;
    margin:9px 0 0!important;
    color:var(--hero-text);
    font-size:11px;line-height:1.55
}
.hcg-model-arrow{
    position:absolute;
    right:18px;bottom:17px;
    color:var(--hero-green);
    font-size:17px;
}
.hcg-model-caption{
    position:absolute;
    z-index:5;
    left:50%;bottom:5px;
    transform:translateX(-50%);
    display:flex;align-items:center;gap:10px;
    white-space:nowrap;
    color:#7b817b;
    font-size:7px;font-weight:700;letter-spacing:.14em;
}
.hcg-model-caption i{
    display:block;width:24px;height:1px;background:rgba(47,107,79,.35)
}

@media (max-width:1050px){
    .hcg-hero-intro{grid-template-columns:minmax(0,1fr) minmax(320px,.82fr);gap:24px}
    .hcg-hero-title{font-size:48px!important}
    .hcg-hero-art{height:320px}
    .hcg-model-orbit-outer{width:330px;height:330px}
    .hcg-model-orbit-inner{width:190px;height:190px}
    .hcg-model-center-wheel{width:270px;height:215px}
    .hcg-model-card h3{font-size:15px!important}
}
@media (max-width:780px){
    .hcg-hero-section{padding:44px 0 60px!important}
    .hcg-hero-intro{display:block;min-height:0}
    .hcg-hero-copy{max-width:650px}
    .hcg-hero-title{font-size:42px!important}
    .hcg-hero-art{
        height:270px;
        margin:24px 0 0;
        box-shadow:0 8px 24px rgba(18,30,22,.07);
    }
    .hcg-model-heading{margin-top:34px}
    .hcg-model-heading h2{font-size:20px!important}
    .hcg-business-model{
        min-height:0;
        display:grid;
        grid-template-columns:1fr 1fr;
        grid-template-rows:auto;
        padding:8px 0 48px;
        gap:12px;
    }
    .hcg-model-orbit,.hcg-model-center{display:none}
    .hcg-model-card-1,
    .hcg-model-card-2,
    .hcg-model-card-3,
    .hcg-model-card-4{
        grid-column:auto;grid-row:auto
    }
    .hcg-model-card{min-height:170px;padding:16px}
    .hcg-model-card h3{font-size:15px!important}
    .hcg-model-caption{bottom:7px}
}
@media (max-width:520px){
    .hcg-hero-title{font-size:35px!important}
    .hcg-hero-description{font-size:13px}
    .hcg-hero-art{height:210px}
    .hcg-model-heading{display:block}
    .hcg-model-index{margin-top:8px}
    .hcg-business-model{grid-template-columns:1fr}
    .hcg-model-card{min-height:0;padding:17px}
    .hcg-model-caption{position:relative;left:auto;bottom:auto;transform:none;grid-column:1;margin:8px auto 0}
}
