/* =============================================================================
   VowsProfile - Matrimony Biodata Stylesheet
   A4 portrait, print-ready, warm gradient theme with ornate border
   ============================================================================= */

:root {
  --paper: #fdf8f0;
  --paper-warm: #f7ece0;
  --gold: #c89455;
  --gold-deep: #9f6733;
  --gold-soft: rgba(200, 148, 85, 0.15);
  --ink: #4a3425;
  --ink-soft: #6b5240;
  --link: #87522c;
}

* {
  box-sizing: border-box;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

html, body {
  margin: 0;
  padding: 0;
  width: 210mm;
  min-height: 297mm;
  background: #d4c4b0;
  font-family: "Palatino Linotype", "Book Antiqua", Georgia, serif;
  color: var(--ink);
}

a { color: var(--link); text-decoration: none; }

/* === PAGE === */
.page {
  position: relative;
  width: 210mm;
  height: 297mm;
  margin: 0 auto;
  overflow: hidden;
  /* Solid warm beige with subtle darker edges -- NO WHITE */
  background:
    /* Darker corners/edges */
    radial-gradient(ellipse at 50% 50%, transparent 50%, rgba(160,120,70,0.12) 100%),
    /* Subtle top band */
    linear-gradient(180deg, rgba(180,140,90,0.1) 0%, transparent 5%),
    /* Subtle bottom band */
    linear-gradient(0deg, rgba(180,140,90,0.08) 0%, transparent 4%),
    /* Base: solid warm beige -- center slightly lighter but NEVER white */
    radial-gradient(ellipse at 50% 45%, #f5e8d4 0%, #efdcc4 50%, #e4ccaa 100%);
  box-shadow: 0 10px 40px rgba(80, 50, 20, 0.2);
}

/* === DECORATIVE BORDER === */
.border-frame {
  position: absolute;
  inset: 0;
  background-image: url('metadata/border.svg');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  overflow: hidden;
}

.border-frame > .content {
  pointer-events: auto;
}

/* === CONTENT === */
.content {
  position: relative;
  z-index: 1;
  height: 100%;
  padding: 9mm 10mm 7mm;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 2mm;
}

/* === SECTION DIVIDER === */
.section-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3mm;
  padding: 1mm 0;
}
.section-divider::before,
.section-divider::after {
  content: "";
  flex: 1;
  height: 0.2mm;
  background: linear-gradient(90deg, transparent, #b8860b 20%, #b8860b 80%, transparent);
}
.section-divider span {
  font-size: 10.5pt;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #6b4a2f;
  white-space: nowrap;
}

.footer-divider {
  margin-top: auto;
}

/* === HERO === */
.hero {
  display: grid;
  grid-template-columns: 1fr 44mm;
  column-gap: 4mm;
  align-items: center;
  padding: 2.5mm 4mm 3mm;
  border-radius: 4mm;
  /* Hero blends with page gradient */
  background: rgba(255, 252, 245, 0.35);
  border: 0.15mm solid rgba(200, 148, 85, 0.12);
  box-shadow: 0 3px 8px rgba(122, 84, 47, 0.04);
}

.identity { text-align: center; }

.ganesh {
  width: 28mm;
  display: block;
  margin: 0 auto 0.5mm;
  opacity: 0.75;
}

.ganesh-line {
  margin: 0 0 1mm;
  font-size: 14pt;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: #b47b42;
}

.name {
  margin: 0 0 0.3mm;
  font-size: 22pt;
  line-height: 1.05;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #5a3820;
  font-weight: 800;
}

.subtitle {
  margin: 0;
  font-size: 11.5pt;
  color: #6d533e;
}
.subtitle span { padding: 0 2mm; color: #b27a42; }

/* === PHOTO === */
.photo {
  justify-self: end;
  width: 40mm;
  height: 50mm;
  padding: 1.2mm;
  background: linear-gradient(160deg, #fdf6ed 0%, #ddb37d 40%, #aa6f36 100%);
  clip-path: polygon(6% 0, 94% 0, 100% 6%, 100% 94%, 94% 100%, 6% 100%, 0 94%, 0 6%);
  box-shadow: 0 4px 10px rgba(104, 72, 42, 0.12);
}
.photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center 15%;
  clip-path: inherit;
}

/* === COLUMNS === */
.columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3.5mm;
  min-height: 0;
}

.panel {
  display: flex;
  flex-direction: column;
  padding: 3.5mm 3.8mm 3mm;
  border-radius: 4mm;
  /* Subtle gradient box like hero */
  background: rgba(255, 252, 245, 0.35);
  border: 0.15mm solid rgba(200, 148, 85, 0.12);
  box-shadow: 0 2px 6px rgba(122, 84, 47, 0.03);
  min-height: 0;
  gap: 2.4mm;
}

/* === ENTRIES === */
.entry {
  display: grid;
  grid-template-columns: 6.5mm 1fr;
  gap: 1.2mm;
  align-items: start;
}

.rail {
  position: relative;
  display: flex;
  justify-content: center;
  min-height: 100%;
  padding-top: 0.1mm;
}
.rail::after {
  content: "";
  position: absolute;
  top: 5.5mm;
  bottom: -2.2mm;
  width: 0.3mm;
  background: #c89455;
  opacity: 0.5;
}
.entry:last-child .rail::after { bottom: 0; }

/* === ICONS === */
.icon {
  width: 5mm;
  height: 5mm;
  flex: 0 0 5mm;
  border-radius: 50%;
  background-color: #c89455;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 58% 58%;
  box-shadow: inset 0 0 0 0.15mm rgba(126, 85, 43, 0.1);
  position: relative;
  z-index: 1;
}

.icon-person { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff7ec' d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4Zm0 2c-3.87 0-7 2.24-7 5v1h14v-1c0-2.76-3.13-5-7-5Z'/%3E%3C/svg%3E"); }
.icon-location { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff7ec' d='M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7Zm0 9.4A2.4 2.4 0 1 1 14.4 9 2.4 2.4 0 0 1 12 11.4Z'/%3E%3C/svg%3E"); }
.icon-edu { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff7ec' d='M12 5 2 10l10 5 8-4v5h2v-6Zm-6 8v3.5C6 18.4 8.7 20 12 20s6-1.6 6-3.5V13l-6 3Z'/%3E%3C/svg%3E"); }
.icon-work { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff7ec' d='M9 6V4h6v2h4a2 2 0 0 1 2 2v3H3V8a2 2 0 0 1 2-2Zm6 0V5H9v1Zm6 7v5a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-5h6v2h6v-2Z'/%3E%3C/svg%3E"); }
.icon-link { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff7ec' d='M10.6 13.4a2 2 0 0 0 2.8 0l3.6-3.6a2 2 0 0 0-2.8-2.8L12.6 8.6l1.4 1.4 1.6-1.6a.5.5 0 0 1 .7.7l-3.6 3.6a.5.5 0 0 1-.7 0ZM6.3 17a2 2 0 0 0 2.8 0l1.6-1.6-1.4-1.4-1.6 1.6a.5.5 0 0 1-.7-.7l3.6-3.6a.5.5 0 1 1 .7.7l-.3.3 1.4 1.4.3-.3a2 2 0 1 0-2.8-2.8L6.3 14.2A2 2 0 0 0 6.3 17Z'/%3E%3C/svg%3E"); }
.icon-family { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff7ec' d='M9 11a3 3 0 1 0-3-3 3 3 0 0 0 3 3Zm6 0a3 3 0 1 0-3-3 3 3 0 0 0 3 3Zm0 2c-2 0-3.8.8-5 2.1C8.8 13.8 7 13 5 13c-2.8 0-5 1.8-5 4v1h10v-1a4.8 4.8 0 0 0-.1-1H20v1h4v-1c0-2.2-2.2-4-5-4Z'/%3E%3C/svg%3E"); }
.icon-home { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff7ec' d='M12 4 4 10v10h16V10Zm-4 9h8v5H8Z'/%3E%3C/svg%3E"); }
.icon-phone { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff7ec' d='M6.62 10.79a15.05 15.05 0 0 0 6.59 6.59l2.2-2.2a1 1 0 0 1 1-.24 11.36 11.36 0 0 0 3.57.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.49a1 1 0 0 1 1 1 11.36 11.36 0 0 0 .57 3.57 1 1 0 0 1-.24 1Z'/%3E%3C/svg%3E"); }

/* === TYPOGRAPHY === */
.entry-body { min-width: 0; }

.title {
  margin: 0 0 0.5mm;
  font-size: 12.5pt;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0.005em;
  text-transform: uppercase;
  color: #5a3820;
}

.details p {
  position: relative;
  margin: 0;
  padding-left: 3mm;
  font-size: 11.5pt;
  line-height: 1.35;
  color: var(--ink-soft);
  margin-bottom: 1.2mm;
}
.details p::before {
  content: "";
  position: absolute;
  left: 0.4mm;
  top: 0.55em;
  width: 1.4mm;
  height: 1.4mm;
  border-radius: 50%;
  background: #b8860b;
  opacity: 0.7;
  transform: translateY(-50%);
}
.details strong { color: #4a3425; font-weight: 700; }

.details .cont,
.details .cont-tight { display: block; margin-top: 0.3mm; margin-bottom: 0.6mm; }
.details .cont { padding-left: 9mm; }
.details .cont-tight { padding-left: 5mm; }
.details .nobullet::before,
.details .cont::before,
.details .cont-tight::before { display: none; }

.brother-gap { margin-bottom: 0.5mm; }

.profiles a {
  border-bottom: 0.5px dotted rgba(141,84,45,0.3);
  overflow-wrap: anywhere;
}

.map-link {
  display: inline-flex;
  align-items: center;
  margin-left: 0.4mm;
  vertical-align: middle;
}
.map-link svg { width: 2.5mm; height: 2.5mm; fill: #b46c34; display: block; }

.contact-spacer { margin-top: 0; }

.phones p.phone-number {
  padding-left: 0;
  margin-bottom: 1.2mm;
}
.phones p.phone-number::before { display: none; }
.phones p.phone-number a {
  font-size: 13pt;
  font-weight: 700;
  color: var(--ink);
  text-decoration: none;
}

.phone {
  display: flex;
  align-items: center;
  gap: 1.5mm;
  font-size: 14pt;
  font-weight: 700;
  color: var(--ink);
  text-decoration: none;
}
.phone .icon {
  width: 5mm;
  height: 5mm;
  flex-basis: 5mm;
  background-size: 55% 55%;
  margin-left: -6.5mm;
}

/* === PRINT === */
@page {
  size: A4 portrait;
  margin: 0;
}

@media print {
  html, body, .page { width: 210mm; height: 297mm; }
  body { background: #efdcc4; }
  .page { box-shadow: none; }
}