/* :root {
    --primary: #0f172a;
    --accent: #2563eb;
    --light: #f8fafc;
    --text: #1e293b;
    --gray: #64748b;
} */

/* =========================================
   ROOT COLOR SYSTEM
========================================= */

/* :root {
    --primary: #0b1f3a;        
    --accent: #1e40af;         
    --light: #f4f6f9;          
    --text: #111111;           
    --gray: #555555;           
    --border: #e5e7eb;              

} */


/* pink theme */

/* :root {
    --primary: #12343b;        
    --accent: #e91e63;         
    --light: #fdf2f6;          
    --text: #111111;          
    --gray: #5f6368;          
    --border: #e8c9d6;         
} */


/* :root {
    --primary: #3a1d2f;        
    --accent: #d81b8a;         
    --light: #fff4f9;          
    --text: #1a1a1a;          
    --gray: #6b5b63;           
    --border: #f0d6e4;         
} */


/* gold theme */

/* :root {
    --primary: #1f1f1f;        
    --accent: #c58b2a;       
    --light: #faf7f2;          
    --text: #1a1a1a;           
    --gray: #6b6b6b;           
    --border: #e6dfd3;         
} */


:root {
     --primary: #0f2f2f;         
    --accent: #c9972b;         
    --light: #f8f6f1;          
    --text: #111111;
    --gray: #5f6368;
    --border: #e4ddd1;
}



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

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


/* =========================================
   BODY TYPOGRAPHY
========================================= */

body {
    font-family: 'Inter', sans-serif;
    font-size: 14.5px;        /* Slightly reduced */
    line-height: 1.6;
    color: var(--text);
    background: #f7f8fa;
}


/* =========================================
   CONTAINER
========================================= */

.container {
    width: 100%;
    max-width: 1200px;
    margin: auto;
    padding: 0 1rem;
}


/* =========================================
   IMAGES & LINKS
========================================= */

img {
    width: 100%;
    display: block;
}

a {
    text-decoration: none;
    color: inherit;
}


/* =========================================
   HEADING SYSTEM (Reduced + Structured)
========================================= */

/* Use slightly stronger weight for headings */
 h2, h3, h4  {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    color: var(--primary);
    margin-bottom: 0.8rem;
}



h1 { font-size: 1.8rem; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.15rem; }
h4 { font-size: 1rem; }


/* =========================================
   PARAGRAPH + TEXT CONTROL
========================================= */

p {
    margin-bottom: 0.8rem;
    color: var(--text);
}


/* =========================================
   SECTION SPACING (Compact Corporate Feel)
========================================= */

section {
    padding: 2.8rem 0;    /* Reduced from modern big spacing */
}





/* =========================================
   FOOTER TYPOGRAPHY DIFFERENT STYLE
========================================= */

footer {
    font-family: 'Roboto', sans-serif;
    font-size: 13px;     /* Smaller */
    color: var(--gray);
}


/* =========================================
   SMALL UTILITY TEXT
========================================= */

.small-text {
    font-size: 13px;
    color: var(--gray);
}


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

@media (max-width: 768px) {

    body {
        font-size: 14px;
    }

    h1 { font-size: 1.6rem; }
    h2 { font-size: 1.35rem; }
    h3 { font-size: 1.05rem; }

    section {
        padding: 2rem 0;
    }
}