/* ==========================================================
   HCG INDUSTRIES SECTION
   Bhairav Advanced Marine Systems
   Clean Corporate / Engineering Visual System
   Plug-and-Play: no icon files required
========================================================== */

.hcg-industries-section{
    position:relative;
    overflow:hidden;
    padding:88px 0 82px;

    background:
        radial-gradient(
            circle at 15% 12%,
            rgba(10,46,99,.045),
            transparent 28%
        ),
        radial-gradient(
            circle at 88% 24%,
            rgba(212,175,55,.055),
            transparent 26%
        ),
        linear-gradient(
            180deg,
            #f8fbfd 0%,
            #eef4f8 100%
        );
}

/* subtle technical background */
.hcg-industries-section::before{
    content:"";
    position:absolute;
    inset:0;

    background-image:
        linear-gradient(
            rgba(10,46,99,.022) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(10,46,99,.022) 1px,
            transparent 1px
        );

    background-size:64px 64px;

    mask-image:
        linear-gradient(
            180deg,
            transparent 0%,
            rgba(0,0,0,.75) 18%,
            rgba(0,0,0,.35) 75%,
            transparent 100%
        );

    -webkit-mask-image:
        linear-gradient(
            180deg,
            transparent 0%,
            rgba(0,0,0,.75) 18%,
            rgba(0,0,0,.35) 75%,
            transparent 100%
        );

    pointer-events:none;
}

/* abstract engineering field */
.hcg-industries-section::after{
    content:"";
    position:absolute;

    width:420px;
    height:420px;

    right:-210px;
    top:-170px;

    border:1px solid rgba(10,46,99,.055);
    border-radius:50%;

    box-shadow:
        0 0 0 45px rgba(10,46,99,.018),
        0 0 0 90px rgba(212,175,55,.018);

    pointer-events:none;
}

.hcg-industries-section .hcg-container{
    position:relative;
    z-index:2;

    max-width:1320px;
}

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

.hcg-industries-header{
    max-width:900px;
    margin:0 auto 46px;
    text-align:center;
}

.hcg-industries-header::before{
    content:"OUR REACH. YOUR ADVANTAGE.";

    display:block;

    margin-bottom:14px;

    color:#C49A24;

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

    letter-spacing:.14em;
    text-transform:uppercase;
}

.hcg-industries-header::after{
    content:"";

    display:block;

    width:42px;
    height:2px;

    margin:18px auto 0;

    background:#D4AF37;
}

.hcg-industries-header h2{
    margin:0 0 14px;

    color:#0A2E63;

    font-size:clamp(34px,4vw,50px);
    font-weight:800;

    line-height:1.08;
    letter-spacing:-.035em;
}

.hcg-industries-header p{
    max-width:860px;

    margin:0 auto;

    color:#50627A;

    font-size:17px;
    line-height:1.7;
}

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

.hcg-industries-grid{
    display:grid;

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

    gap:18px;
}

/* ==========================================================
   INDUSTRY CARD
========================================================== */

.hcg-industries-card{
    position:relative;

    min-height:190px;

    padding:26px 20px 24px;

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

    text-align:center;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.98),
            rgba(255,255,255,.90)
        );

    border:1px solid rgba(10,46,99,.07);

    border-radius:20px;

    text-decoration:none !important;

    box-shadow:
        0 12px 30px rgba(10,46,99,.055);

    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);

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

.hcg-industries-card:hover{
    transform:translateY(-5px);

    border-color:rgba(212,175,55,.48);

    box-shadow:
        0 20px 42px rgba(10,46,99,.10);
}

/* ==========================================================
   ICON
   All 12 icons are embedded directly in CSS.
========================================================== */

.hcg-industries-card::before{
    content:"";

    display:block;

    width:64px;
    height:64px;

    margin-bottom:17px;

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

    flex:0 0 64px;

    transition:
        transform .25s ease;
}

.hcg-industries-card:hover::before{
    transform:translateY(-3px) scale(1.04);
}

/* ==========================================================
   GOLD UNDERLINE
========================================================== */

.hcg-industries-card::after{
    content:"";

    width:32px;
    height:2px;

    margin-top:15px;

    background:#D4AF37;

    border-radius:10px;

    transition:
        width .25s ease;
}

.hcg-industries-card:hover::after{
    width:48px;
}

/* ==========================================================
   ICON 01 — SHIPBUILDING
========================================================== */

.hcg-industries-card:nth-child(1)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 57h56l-7 12H27z'/%3E%3Cpath d='M31 57V37h28v20M38 37v-9h14v9M45 28v-8M45 20h13'/%3E%3Cpath d='M16 72c8 7 16 7 24 0 8 7 16 7 24 0 8 7 16 7 24 0'/%3E%3C/g%3E%3Cpath d='M43 43h5' stroke='%23D4AF37' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 02 — MARINE / OFFSHORE */
.hcg-industries-card:nth-child(2)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 70h60M30 70V36h12v34M42 36h18l8 34M34 36l8-16 8 16M22 78c8-6 16-6 24 0 8-6 16-6 24 0'/%3E%3C/g%3E%3Cpath d='M62 42c7-8 13-8 17-5-3 7-8 10-17 9' stroke='%23D4AF37' stroke-width='3' fill='none'/%3E%3C/svg%3E");
}

/* 03 — PORTS */
.hcg-industries-card:nth-child(3)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 70h60M30 70V25h4v45M32 25l22 17h-9l17 12h-9l17 16'/%3E%3Cpath d='M50 54h18v10H50zM18 70c8-5 16-5 24 0'/%3E%3C/g%3E%3Cpath d='M54 42h10' stroke='%23D4AF37' stroke-width='3'/%3E%3C/svg%3E");
}

/* 04 — WATER */
.hcg-industries-card:nth-child(4)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M48 18c9 13 15 21 15 30a15 15 0 1 1-30 0c0-9 6-17 15-30zM23 39a27 27 0 0 1 35-14M73 57a27 27 0 0 1-35 14'/%3E%3C/g%3E%3Cpath d='M48 36v20M40 48h16' stroke='%23D4AF37' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 05 — DEFENCE */
.hcg-industries-card:nth-child(5)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cpath d='M48 16l27 10v20c0 18-12 29-27 34-15-5-27-16-27-34V26z' stroke='%230A2E63' stroke-width='3'/%3E%3Cpath d='M48 30v27M35 43h26' stroke='%23D4AF37' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M48 30c0 8-4 13-11 13M48 30c0 8 4 13 11 13' stroke='%230A2E63' stroke-width='3'/%3E%3C/svg%3E");
}

/* 06 — COASTAL / WATERWAYS */
.hcg-industries-card:nth-child(6)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 62h64M22 62V38M74 62V38M22 38h52M28 38c8 18 32 18 40 0M28 38v24M36 38v24M60 38v24M68 38v24M16 72c10-6 20-6 32 0 12-6 22-6 32 0'/%3E%3C/g%3E%3Cpath d='M47 28h4' stroke='%23D4AF37' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 07 — OIL / GAS */
.hcg-industries-card:nth-child(7)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 72h60M24 72V43l18 10V43l14 10V30h10v42M61 30v-9h8M33 72V58M47 72V58'/%3E%3C/g%3E%3Cpath d='M64 38h8' stroke='%23D4AF37' stroke-width='3'/%3E%3C/svg%3E");
}

/* 08 — ENERGY */
.hcg-industries-card:nth-child(8)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M30 72h36M36 72l12-48 12 48M40 40h16M36 52h24M32 64h32'/%3E%3Cpath d='M70 25l-10 17h9l-7 15' stroke='%23D4AF37' stroke-width='4'/%3E%3C/g%3E%3C/svg%3E");
}

/* 09 — INDUSTRIAL */
.hcg-industries-card:nth-child(9)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 72V45l18 10V45l18 10V35h22v37zM25 72V61M39 72V61M54 48h8M68 48h6M54 59h8M68 59h6'/%3E%3C/g%3E%3Cpath d='M73 35v-9' stroke='%23D4AF37' stroke-width='3'/%3E%3C/svg%3E");
}

/* 10 — DREDGING */
.hcg-industries-card:nth-child(10)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 68h60M25 68l7-13h18l9 13M42 55V27h5v28M45 27l20 12M65 39v15l-9 8M18 76c8-5 16-5 24 0 8-5 16-5 24 0 8-5 16-5 24 0'/%3E%3C/g%3E%3Cpath d='M32 55h18' stroke='%23D4AF37' stroke-width='3'/%3E%3C/svg%3E");
}

/* 11 — GOVERNMENT */
.hcg-industries-card:nth-child(11)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 32h64L48 18zM22 32v6h52v-6M26 38v28M38 38v28M50 38v28M62 38v28M74 38v28M18 66h60v8H18z'/%3E%3C/g%3E%3Cpath d='M45 22h6' stroke='%23D4AF37' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 12 — ENGINEERING / EPC */
.hcg-industries-card:nth-child(12)::before{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96' fill='none'%3E%3Cg stroke='%230A2E63' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='30' cy='30' r='9'/%3E%3Ccircle cx='66' cy='30' r='9'/%3E%3Ccircle cx='48' cy='66' r='9'/%3E%3Cpath d='M38 30h20M35 37l8 21M61 37l-8 21'/%3E%3C/g%3E%3Ccircle cx='48' cy='66' r='3' fill='%23D4AF37'/%3E%3C/svg%3E");
}


/* ==========================================================
   TITLE
========================================================== */

.hcg-industries-card span{
    display:block;

    max-width:240px;

    color:#0A2E63;

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

    line-height:1.42;

    transition:
        color .22s ease;
}

.hcg-industries-card:hover span{
    color:#173F6D;
}


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

.hcg-industries-footer{
    margin-top:38px;

    text-align:center;
}

.hcg-industries-button{
    position:relative;

    display:inline-flex;

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

    min-height:54px;

    padding:0 32px;

    border:1px solid #0A2E63;
    border-radius:11px;

    background:#0A2E63;

    color:#fff !important;

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

    text-decoration:none !important;

    box-shadow:
        0 12px 28px rgba(10,46,99,.18);

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

.hcg-industries-button::after{
    content:"→";

    margin-left:12px;

    color:#F0C94F;

    font-size:20px;
    line-height:1;

    transition:
        transform .22s ease;
}

.hcg-industries-button:hover{
    transform:translateY(-3px);

    background:#123A67;

    box-shadow:
        0 17px 34px rgba(10,46,99,.24);
}

.hcg-industries-button:hover::after{
    transform:translateX(4px);
}


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

@media (max-width:1100px){

    .hcg-industries-section{
        padding:72px 0;
    }

    .hcg-industries-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
}


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

@media (max-width:768px){

    .hcg-industries-section{
        padding:62px 0;
    }

    .hcg-industries-section .hcg-container{
        padding-left:18px;
        padding-right:18px;
    }

    .hcg-industries-header{
        margin-bottom:34px;
    }

    .hcg-industries-header h2{
        font-size:36px;
    }

    .hcg-industries-header p{
        font-size:16px;
    }

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

    .hcg-industries-card{
        min-height:175px;
        padding:22px 14px;
    }
}


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

@media (max-width:540px){

    .hcg-industries-section{
        padding:54px 0;
    }

    .hcg-industries-section::after{
        right:-280px;
        top:-100px;
    }

    .hcg-industries-grid{
        grid-template-columns:1fr;
        gap:14px;
    }

    .hcg-industries-card{
        min-height:154px;
    }

    .hcg-industries-header h2{
        font-size:32px;
    }

    .hcg-industries-header p{
        font-size:15px;
    }

    .hcg-industries-button{
        width:100%;
        max-width:320px;
    }
}