﻿/* Theme: Baradari – Mughal garden pavilion: powder blue, pearl lace, imperial white marble arches */
:root {
  --primary: #2a4d69;
  --accent: #c9b07a;
  --bg: #0f1c26;
  --card: #f7f9fb;
  --ink: #1e2d3d;
  --muted: #5c768d;
  --line: rgba(201,176,122,.32);
  --backdrop: radial-gradient(circle at 50% 25%, #2a4d69, #0f1c26 80%);
  --env: #2a4d69;
  --env-dark: #193144;
  --door: #162a3b;
  --curtain: #2a4d69;
  --font-display: 'Fraunces', Georgia, serif;
  --font-script: 'Great Vibes', cursive;
  --ornament: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 38' fill='none' stroke='%23c9b07a' stroke-width='1.2' stroke-linecap='round'%3E%3Cpath d='M2 19h45M113 19h45'/%3E%3Cpath d='M80 6c-8 0-14 6-14 13 0 7 6 13 14 13 4 0 7-1 10-4-3 1-7 0-9-3-3-3-3-7 0-10 2-2 5-3 9-3-3-4-6-6-10-6z' fill='%23c9b07a' fill-opacity='.18' stroke='%23c9b07a'/%3E%3Ccircle cx='54' cy='19' r='2' fill='%232a4d69'/%3E%3Ccircle cx='106' cy='19' r='2' fill='%232a4d69'/%3E%3C/svg%3E");
}

body { color: var(--ink); }
.card {
  box-shadow: 0 40px 90px -30px rgba(0,0,0,.5), 0 0 0 1px rgba(201,176,122,.35);
  background: var(--card);
}

.hero {
  background-color: var(--card);
  background-image:
    radial-gradient(circle at 50% 0%, rgba(201,176,122,.15) 0%, transparent 68%),
    radial-gradient(circle at 50% 100%, rgba(42,77,105,.06) 0%, transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44' fill='none' stroke='%23c9b07a' stroke-opacity='.14' stroke-width='1'%3E%3Cpath d='M22 2l4 16 16 4-16 4-4 16-4-16-16-4 16-4z'/%3E%3Ccircle cx='22' cy='22' r='2' fill='%232a4d69' fill-opacity='.18'/%3E%3C/svg%3E");
}

.hero::before, .hero::after {
  content: ''; position: absolute; top: 48px; width: 88px; height: 88px; opacity: .85;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88 88' fill='none' stroke='%23c9b07a' stroke-width='1.2' stroke-linecap='round'%3E%3Cpath d='M4 4h40M4 4v40'/%3E%3Cpath d='M10 10q30 0 30 30M10 10q0 30 30 30' stroke='%232a4d69' stroke-opacity='.4'/%3E%3Ccircle cx='12' cy='12' r='3' fill='%23c9b07a'/%3E%3Ccircle cx='24' cy='24' r='2' fill='%232a4d69'/%3E%3C/svg%3E") center/contain no-repeat;
}
.hero::before { left: 16px; }
.hero::after { right: 16px; transform: scaleX(-1); }

.name {
  color: var(--primary);
  text-shadow: 0 2px 4px rgba(42,77,105,.12);
}
.amp { color: var(--accent); }

.monogram {
  border-color: #c9b07a;
  color: var(--primary);
  background: linear-gradient(135deg, #ffffff, #f0f4f8);
  box-shadow: 0 4px 14px rgba(42,77,105,.15);
}

.frame {
  border: 2px solid #c9b07a;
  background: #ffffff;
  border-radius: 24px 6px 24px 6px;
  box-shadow: 0 10px 28px -10px rgba(42,77,105,.12);
}
.frame::before {
  inset: 6px;
  border: 1px solid var(--line);
  border-radius: 18px 4px 18px 4px;
}

.bismillah { color: var(--primary); font-size: 1.35rem; }
.event {
  background: #ffffff;
  border-color: var(--line);
  box-shadow: 0 4px 16px rgba(42,77,105,.04);
}
.btn.primary {
  background: linear-gradient(135deg, #2a4d69 0%, #1e3a52 100%);
  color: #ffffff;
  border: 1px solid #c9b07a;
  box-shadow: 0 6px 20px -4px rgba(42,77,105,.35);
}
.btn.ghost {
  border-color: var(--line);
  color: var(--primary);
}
.btn.ghost:hover {
  border-color: var(--accent);
  background: rgba(201,176,122,.08);
}
