/* =========================================================
   SIDDHI COAL & TRADING
   SINGLE GLOBAL STYLESHEET
   Merged from main.css + style.css
   ========================================================= */

/* ---------- Global variables ---------- */
:root{
    --m:#7a1f1f;
    --d:#11171a;
    --g:#d6a23a;
    --gold:var(--g);
    --gold-light:#f2c35b;
    --c:#fff9ef;
    --t:#332a25;
    --u:#75675e;
    --l:#eadbc9;
    --w:#fff;
    --max:1180px;
    --shadow:0 15px 40px rgba(0,0,0,.12);
}

/* ---------- Reset / base ---------- */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:Arial,Helvetica,sans-serif;
    color:var(--t);
    background:var(--c);
    line-height:1.6;
}
a{color:inherit}
.container{width:min(var(--max),92%);margin:auto}

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

.site-header{
    position:sticky;
    top:0;
    z-index:1000;
    background:#101619;
    color:#fff;
    border-bottom:1px solid rgba(214,162,58,.55);
}
.site-header .container{
    min-height:74px;
    display:flex;
    align-items:center;
    gap:28px;
}
.logo{
    display:flex;
    align-items:center;
    text-decoration:none;
    margin-right:auto;
}
.logo img{
    width:210px;
    height:auto;
    display:block;
}
.main-nav{
    display:flex;
    align-items:center;
    gap:24px;
}
.main-nav a{
    font-size:14px;
    text-decoration:none;
    padding:27px 0;
    position:relative;
    color:#fff;
}
.main-nav a:hover,
.main-nav a.active{
    color:var(--g);
}
.main-nav a.active:after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:17px;
    height:2px;
    background:var(--g);
}
.header-cta{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:#f2c35b;
    color:#17130f;
    text-decoration:none;
    font-weight:800;
    padding:11px 18px;
    border-radius:24px;
    white-space:nowrap;
}
.header-cta:hover{filter:brightness(1.06)}
.mobile-note{display:none}

/* =========================================================
   HOME / MAIN HERO
   ========================================================= */

.hero-banner{
    position:relative;
    height:650px;
    overflow:hidden;
    background:#111;
}
.hero-slide{
    position:absolute;
    inset:0;
    opacity:0;
    visibility:hidden;
    transition:opacity .7s ease;
    background-position:center;
    background-size:cover;
}
.hero-slide.active{
    opacity:1;
    visibility:visible;
}
.hero-slide-1{
    background-image:url('https://siddhicoaltrading.com/assets/images/hero-1.jpeg');
}
.hero-slide-2{
    background-image:url('https://siddhicoaltrading.com/assets/images/hero-2.jpeg');
}
.hero-slide-3{
    background-image:url('https://siddhicoaltrading.com/assets/images/hero-3.jpeg');
}
.hero-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(
        90deg,
        rgba(5,5,5,.90) 0%,
        rgba(10,10,10,.68) 46%,
        rgba(10,10,10,.25) 100%
    );
}
.hero-banner-content{
    position:relative;
    z-index:2;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    color:#fff;
    padding-bottom:40px;
}
.hero-banner-content h1{
    font-size:clamp(43px,6vw,76px);
    line-height:1.02;
    margin:17px 0;
}
.hero-banner-content h1 span{color:var(--gold-light)}
.hero-banner-content p{
    max-width:650px;
    font-size:18px;
    color:#e3e3e3;
}
.hero-arrow{
    position:absolute;
    z-index:5;
    top:50%;
    transform:translateY(-50%);
    width:48px;
    height:48px;
    border:1px solid rgba(255,255,255,.35);
    border-radius:50%;
    background:rgba(0,0,0,.35);
    color:#fff;
    font-size:34px;
    line-height:1;
    cursor:pointer;
}
.hero-arrow:hover{
    background:var(--gold);
    color:#111;
    border-color:var(--gold);
}
.hero-prev{left:25px}
.hero-next{right:25px}
.hero-dots{
    position:absolute;
    z-index:5;
    left:50%;
    bottom:30px;
    transform:translateX(-50%);
    display:flex;
    gap:9px;
}
.hero-dot{
    width:10px;
    height:10px;
    border:1px solid #fff;
    border-radius:50%;
    background:transparent;
    cursor:pointer;
    padding:0;
}
.hero-dot.active{
    background:var(--gold);
    border-color:var(--gold);
    width:28px;
    border-radius:8px;
}

/* =========================================================
   HOME / MAIN CONTENT
   ========================================================= */

.intro{background:#fff}
.intro-grid,
.why-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:65px;
    align-items:center;
}
.intro-image{
    min-height:480px;
    border-radius:18px;
    background:
        linear-gradient(0deg,rgba(0,0,0,.7),transparent 60%),
        url('https://images.unsplash.com/photo-1513828583688-c52646db42da?auto=format&fit=crop&w=1200&q=85')
        center/cover;
    position:relative;
    box-shadow:var(--shadow);
}
.image-label{
    position:absolute;
    left:25px;
    bottom:25px;
    color:#fff;
}
.image-label strong{
    display:block;
    font-size:21px;
}
.image-label span{
    font-size:13px;
    color:#ddd;
}
.intro-copy p,
.section-head p{
    color:#656a70;
}
.checks{
    list-style:none;
    padding:0;
    margin:25px 0;
}
.checks li{
    margin:12px 0;
    font-weight:650;
}
.check{
    display:inline-grid;
    place-items:center;
    width:25px;
    height:25px;
    border-radius:50%;
    background:#efe0b9;
    color:#7b5a14;
    margin-right:10px;
}
.section-head{
    max-width:720px;
    margin-bottom:40px;
}
.services-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}
.service{
    background:#fff;
    border:1px solid #e6e1d6;
    border-radius:14px;
    padding:30px;
    transition:.25s;
    box-shadow:0 8px 30px rgba(0,0,0,.04);
}
.service:hover{
    transform:translateY(-5px);
    box-shadow:0 18px 45px rgba(0,0,0,.10);
    border-color:#dcc28a;
}
.service-icon{
    width:45px;
    height:45px;
    border-radius:10px;
    background:#eee4cb;
    color:#8b681d;
    display:grid;
    place-items:center;
    font-size:20px;
}
.service h3{margin:18px 0 7px}
.service p{
    color:#6b6f73;
    font-size:14px;
}

/* ---------- Main process ---------- */
.process-how-we-work{
    background:#171717;
    color:#fff;
    margin-top:25px;
}
.process-how-we-work h2{color:#fff}
.process-how-we-work .section-head p{color:#aaa}
.process-how-we-work-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;
}
.process-how-we-work .step{
    padding:25px;
    border-top:2px solid #7e6229;
    background:#202020;
}
.process-how-we-work .step-no{
    color:var(--gold);
    font-size:11px;
    font-weight:800;
    letter-spacing:1.5px;
}
.process-how-we-work .step h3{margin:12px 0 7px}
.process-how-we-work .step p{
    color:#aaa;
    font-size:14px;
}

/* ---------- Main features ---------- */
.feature-list{
    display:grid;
    gap:20px;
}
.feature{
    display:flex;
    gap:18px;
    align-items:flex-start;
}
.feature-number{
    font-size:13px;
    color:#8c6b22;
    font-weight:900;
    border:1px solid #d8c28f;
    border-radius:50%;
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    flex:none;
}
.feature p{
    color:#6c7075;
    margin:3px 0;
}

/* ---------- Main quote ---------- */
.quote-box{
    background:#171717;
    color:#fff;
    padding:48px;
    border-radius:18px;
    box-shadow:var(--shadow);
}
.quote-mark{
    font-size:55px;
    color:var(--gold);
    line-height:.7;
}
.quote-box blockquote{
    font-size:28px;
    font-weight:800;
    line-height:1.25;
    margin:15px 0 22px;
}
.quote-box p{color:#bcbcbc}

/* ---------- Shared CTA ----------
   The outer .cta is shared by the investor CTA.
   .cta-wrap .cta is the main/home image CTA.
*/
.cta{
    color:#fff;
}
.cta-wrap{
    padding:35px 0 90px;
}
.cta-wrap .cta{
    border-radius:20px;
    overflow:hidden;
    background:
        linear-gradient(90deg,rgba(20,20,20,.96),rgba(20,20,20,.72)),
        url('https://images.unsplash.com/photo-1516939884455-1445c8652f83?auto=format&fit=crop&w=1600&q=85')
        center/cover;
    padding:65px;
}
.cta-wrap .cta h2{color:#fff}
.cta-wrap .cta p{
    color:#d0d0d0;
    max-width:650px;
}

/* =========================================================
   INVESTOR PAGE
   ========================================================= */

.investor-hero{
    position:relative;
    min-height:500px;
    background:
        linear-gradient(
            90deg,
            rgba(8,12,15,.94),
            rgba(8,12,15,.72) 52%,
            rgba(8,12,15,.2)
        ),
        url('assets/images/investor-banner.png') center/cover no-repeat;
    display:flex;
    align-items:center;
}
.investor-hero .container{padding:80px 0}
.eyebrow{
    color:var(--g);
    font-weight:800;
    letter-spacing:2px;
    text-transform:uppercase;
    font-size:14px;
}
.investor-hero h1{
    font:700 clamp(42px,6vw,72px)/1.05 Georgia,serif;
    color:#fff;
    max-width:780px;
    margin:12px 0 18px;
}
.investor-hero h1 span{color:var(--g)}
.investor-hero p{
    max-width:700px;
    color:#f7f2e8;
    font-size:18px;
}
.buttons{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    margin-top:28px;
}
.btn{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:13px 22px;
    border-radius:5px;
    text-decoration:none;
    font-weight:800;
}
.btn-gold{
    background:var(--g);
    color:#211b15;
}
.btn-outline{
    border:1px solid var(--g);
    color:#fff;
}
.btn-outline:hover{
    background:var(--g);
    color:#211b15;
}

/* ---------- Investor summary ---------- */
.summary{
    margin-top:-50px;
    position:relative;
    z-index:2;
}
.summary-grid{
    width:min(1050px,92%);
    margin:auto;
    background:var(--d);
    border:1px solid rgba(214,162,58,.65);
    border-radius:10px;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    overflow:hidden;
    box-shadow:0 18px 50px rgba(0,0,0,.18);
}
.summary-item{
    padding:27px 30px;
    border-right:1px solid rgba(255,255,255,.12);
    color:#fff;
}
.summary-item:last-child{border-right:0}
.summary-icon{
    width:44px;
    height:44px;
    border:1px solid var(--g);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--g);
    margin-bottom:12px;
}
.summary-item h3{
    font-size:14px;
    margin:0 0 4px;
}
.summary-item strong{
    color:var(--g);
    font-size:25px;
}
.summary-item p{
    margin:4px 0 0;
    color:#ddd;
    font-size:14px;
}

/* ---------- Investor sections ---------- */
.section{padding:85px 0}
.section.alt{background:#f2eadf}
.heading{
    max-width:760px;
    margin-bottom:40px;
}
.heading small{
    color:#9b7121;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:1.7px;
}
.heading h2{
    font:700 clamp(32px,4vw,48px)/1.1 Georgia,serif;
    margin:10px 0 14px;
    color:#241c16;
}
.heading p{
    color:var(--u);
    font-size:17px;
}

/* ---------- Investor cards ---------- */
.cards{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
}
.card{
    background:#fff;
    border:1px solid var(--l);
    border-radius:8px;
    padding:28px 22px;
    transition:.2s;
}
.card:hover{
    transform:translateY(-4px);
    box-shadow:0 14px 35px rgba(0,0,0,.08);
    border-color:var(--g);
}
.card i{
    color:var(--g);
    font-size:27px;
}
.card h3{margin:15px 0 8px}
.card p{
    margin:0;
    color:var(--u);
}

/* ---------- Investor why section ---------- */
.dark{
    background:var(--d);
    color:#fff;
}
.dark .heading h2{color:#fff}
.dark .heading p{color:#d5d0c8}
.why-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
}
.why{
    display:flex;
    gap:15px;
    padding:24px;
    border:1px solid rgba(214,162,58,.25);
    border-radius:8px;
    background:rgba(255,255,255,.025);
}
.num{
    min-width:42px;
    height:42px;
    border-radius:50%;
    background:var(--g);
    color:#211b15;
    font-weight:800;
    display:grid;
    place-items:center;
}
.why h3{margin:0 0 6px}
.why p{
    margin:0;
    color:#c9c3bb;
}

/* ---------- Investor process ----------
   Context-specific selector prevents conflict with
   .process-how-we-work .step above.
*/
.process{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
}
.process .step{
    background:#fff;
    padding:25px;
    border-top:3px solid var(--g);
    box-shadow:0 10px 30px rgba(0,0,0,.06);
}
.process .step b{
    font-size:36px;
    color:#eadbc9;
}
.process .step h3{margin:8px 0}
.process .step p{
    color:var(--u);
    margin:0;
}

/* ---------- Investor CTA ----------
   Uses .cta but is kept separate from .cta-wrap .cta.
*/
.cta:not(.cta-wrap .cta){
    background:#11171a;
    padding:65px 0;
}
.cta-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}
.cta:not(.cta-wrap .cta) h2{
    font:700 clamp(30px,4vw,44px)/1.1 Georgia,serif;
    margin:0 0 10px;
}
.cta:not(.cta-wrap .cta) p{
    color:#d5d0c8;
    margin:0;
    max-width:700px;
}
.whatsapp{
    display:inline-flex;
    align-items:center;
    gap:9px;
    background:#25d366;
    color:#fff;
    text-decoration:none;
    padding:14px 22px;
    border-radius:5px;
    font-weight:800;
    white-space:nowrap;
}

/* ---------- Investor enquiry ---------- */
.enquiry{background:#f2eadf}
.enquiry-grid{
    display:grid;
    grid-template-columns:.85fr 1.15fr;
    gap:45px;
}
.contact-box{
    background:#11171a;
    color:#fff;
    padding:32px;
    border-radius:8px;
}
.contact-box h3{
    font:700 28px Georgia,serif;
    margin-top:0;
}
.contact-box p{color:#d5d0c8}
.detail{
    display:flex;
    gap:12px;
    margin-top:20px;
}
.detail i{
    color:var(--g);
    margin-top:5px;
}
.detail strong{display:block}
.detail span{color:#ccc}
.form{
    background:#fff;
    padding:32px;
    border-radius:8px;
    box-shadow:0 10px 35px rgba(0,0,0,.08);
}
.row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}
.group{margin-bottom:16px}
.group label{
    display:block;
    font-weight:700;
    font-size:14px;
    margin-bottom:6px;
}
.group input,
.group select,
.group textarea{
    width:100%;
    padding:12px 13px;
    border:1px solid #d9cec0;
    border-radius:5px;
    font:inherit;
    outline:0;
}
.group textarea{
    min-height:125px;
    resize:vertical;
}
.group input:focus,
.group select:focus,
.group textarea:focus{
    border-color:var(--g);
    box-shadow:0 0 0 3px rgba(214,162,58,.12);
}
.submit{
    border:0;
    background:var(--g);
    color:#211b15;
    font-weight:800;
    padding:14px 18px;
    border-radius:5px;
    width:100%;
    cursor:pointer;
}

/* ---------- Disclaimer ---------- */
.disclaimer{
    background:#211c18;
    color:#aaa39b;
    text-align:center;
    font-size:12px;
    padding:25px 4%;
    line-height:1.7;
}

/* =========================================================
   GLOBAL FOOTER
   ========================================================= */

.site-footer{
    background:#101619;
    color:#ddd;
    border-top:1px solid rgba(214,162,58,.4);
}
.site-footer .container{
    display:grid;
    grid-template-columns:1.3fr .8fr .8fr 1fr;
    gap:35px;
    padding:55px 0;
}
.footer-brand img{width:205px}
.footer-brand p,
.footer-contact p{
    color:#aaa;
    margin:12px 0;
}
.footer-links h4,
.footer-contact h4{
    color:#fff;
    margin-top:0;
}
.footer-links a{
    display:block;
    text-decoration:none;
    color:#bbb;
    margin:8px 0;
    font-size:14px;
}
.footer-links a:hover,
.footer-contact a:hover{
    color:var(--g);
}
.footer-contact a{color:#ddd}

.footer-social{
    display:flex;
    gap:10px;
    margin-top:12px;
}
.footer-social a{
    width:40px;
    height:40px;
    border:1px solid #444;
    border-radius:50%;
    display:grid;
    place-items:center;
    text-decoration:none;
    color:#ddd;
    font-size:17px;
    transition:.2s;
}
.footer-social a:hover{
    border-color:var(--g);
    background:var(--g);
    color:#111;
    transform:translateY(-3px);
}
.social-title{margin-top:25px!important}
.gst{
    margin-top:17px;
    font-size:13px;
    color:#aaa;
}
.gst strong{color:#eee}
.footer-bottom{
    border-top:1px solid rgba(255,255,255,.08);
    padding:16px;
    text-align:center;
    color:#999;
    font-size:13px;
}

/* ---------- Floating WhatsApp ---------- */
.site-footer + .whatsapp,
body > .whatsapp{
    position:fixed;
    right:22px;
    bottom:22px;
    width:54px;
    height:54px;
    border-radius:50%;
    background:#25d366;
    color:#fff;
    display:grid;
    place-items:center;
    font-size:25px;
    z-index:60;
    box-shadow:0 8px 25px rgba(0,0,0,.3);
}

/* =========================================================
   RESPONSIVE - 980px
   ========================================================= */

@media(max-width:980px){

    .main-nav{display:none}
    .header-cta{margin-left:auto}

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

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

    .site-footer .container{
        grid-template-columns:1fr 1fr;
    }

    .enquiry-grid{
        grid-template-columns:1fr;
    }

    .hero-banner{
        height:620px;
    }

    .hero-arrow{
        width:42px;
        height:42px;
        font-size:29px;
    }

    .hero-prev{left:12px}
    .hero-next{right:12px}

    .intro-grid,
    .why-grid{
        grid-template-columns:1fr;
        gap:35px;
    }

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

    .process-how-we-work-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .investor-hero{
        min-height:520px;
    }
}

/* =========================================================
   RESPONSIVE - 650px
   ========================================================= */

@media(max-width:650px){

    .site-header .container{
        min-height:66px;
    }

    .logo img{
        width:175px;
    }

    .header-cta{
        padding:9px 12px;
        font-size:12px;
    }

    .hero-banner{
        height:600px;
    }

    .hero-banner-content{
        padding:0 20px 40px;
    }

    .hero-banner-content h1{
        font-size:clamp(38px,12vw,52px);
    }

    .hero-banner-content p{
        font-size:16px;
    }

    section{
        padding:65px 0;
    }

    .services-grid,
    .process-how-we-work-grid,
    .cards,
    .why-grid,
    .process,
    .row{
        grid-template-columns:1fr;
    }

    .cta-wrap .cta{
        padding:38px 25px;
    }

    .cta-inner{
        flex-direction:column;
        align-items:flex-start;
    }

    .investor-hero{
        min-height:560px;
    }

    .investor-hero .container{
        padding:65px 0;
    }

    .investor-hero h1{
        font-size:42px;
    }

    .investor-hero p{
        font-size:16px;
    }

    .summary{
        margin-top:-35px;
    }

    .summary-grid{
        grid-template-columns:1fr;
    }

    .summary-item{
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.12);
    }

    .summary-item:last-child{
        border-bottom:0;
    }

    .section{
        padding:65px 0;
    }

    .site-footer .container{
        grid-template-columns:1fr;
    }

    .form,
    .contact-box{
        padding:24px;
    }

    /* Keep WhatsApp floating on mobile */
    body > .whatsapp{
        width:54px;
        height:54px;
        padding:0;
        justify-content:center;
    }
}