
/* =====================================================
   GRAND GARUDA BUILDCON
   COMMON DESIGN SYSTEM
   ===================================================== */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@500;600;700&display=swap');

:root {
    --gg-bg: #05090c;
    --gg-surface: #0a141a;
    --gg-surface-alt: #101d24;

    --gg-gold: #e5ad3e;
    --gg-gold-light: #f7d47c;
    --gg-gold-dark: #ad7621;

    --gg-white: #ffffff;
    --gg-text: #f5f6f7;
    --gg-muted: #a5afb7;

    --gg-border: rgba(255,255,255,0.12);

    --gg-font-body: 'DM Sans', sans-serif;
    --gg-font-heading: 'Playfair Display', serif;

    --gg-radius: 12px;
    --gg-container: 1440px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-height: 100vh;
    background: var(--gg-bg);
    color: var(--gg-text);
    font-family: var(--gg-font-body);
    -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
    font: inherit;
}

button {
    cursor: pointer;
}

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

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

.gg-container {
    width: min(100% - 48px, var(--gg-container));
    margin-inline: auto;
}

.gg-heading {
    font-family: var(--gg-font-heading);
    font-weight: 600;
    line-height: 1.15;
}

.gg-gold-text {
    color: var(--gg-gold);
}

.gg-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 12px 22px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-weight: 600;
    transition: background 0.2s, transform 0.2s;
}

.gg-btn:hover {
    transform: translateY(-2px);
}

.gg-btn-primary {
    color: #14100a;
    background: linear-gradient(
        135deg,
        var(--gg-gold-light),
        var(--gg-gold)
    );
}

.gg-btn-outline {
    border-color: var(--gg-gold);
    background: transparent;
    color: var(--gg-gold);
}

.gg-btn-outline:hover {
    background: rgba(229,173,62,0.12);
}

.gg-card {
    overflow: hidden;
    border: 1px solid var(--gg-border);
    border-radius: var(--gg-radius);
    background: var(--gg-surface);
}

.gg-section {
    padding: 70px 0;
}

@media (max-width: 768px) {
    .gg-container {
        width: min(100% - 28px, var(--gg-container));
    }

    .gg-section {
        padding: 45px 0;
    }
}


