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

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

:root {
    --saffron: #FF9933;
    --deep-saffron: #e8850a;
    --cream: #FFF8F0;
    --parchment: #F5E6D3;
    --dark: #2D1B0E;
    --gold: #C5A55A;
    --maroon: #800000;
}

body {
    font-family: 'Noto Sans Devanagari', sans-serif;
    background: var(--cream);
    color: var(--dark);
    min-height: 100vh;
}

/* Header */
header {
    background: linear-gradient(135deg, var(--maroon), #4a0e0e);
    color: var(--cream);
    text-align: center;
    padding: 2rem 1rem;
    position: relative;
    overflow: hidden;
}

header::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 5 L35 25 L55 30 L35 35 L30 55 L25 35 L5 30 L25 25 Z' fill='none' stroke='rgba(197,165,90,0.1)' stroke-width='1'/%3E%3C/svg%3E");
    pointer-events: none;
}

header h1 {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 0.3rem;
    position: relative;
    text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

header .subtitle {
    font-size: 1.1rem;
    color: var(--gold);
    font-weight: 400;
    position: relative;
}

.ornament {
    color: var(--gold);
    font-size: 1.5rem;
    margin: 0.5rem 0;
    position: relative;
    letter-spacing: 0.5rem;
}

/* Footer */
footer {
    text-align: center;
    padding: 2rem 1rem;
    color: var(--maroon);
    font-size: 0.85rem;
    opacity: 0.7;
}

footer .om {
    font-size: 2rem;
    display: block;
    margin-bottom: 0.5rem;
    opacity: 0.5;
}

/* Responsive header */
@media (max-width: 600px) {
    header h1 { font-size: 1.5rem; }
    header .subtitle { font-size: 0.9rem; }
    header { padding: 1.5rem 1rem; }
}