/* Color Variables (from style tag in HTML) */
:root {
  --military-primary: #0f4c3a;
  --military-secondary: #b8860b;
  --military-gold: #c59d1f;
  --primary-foreground: #ffffff;
  --body-bg: #f3f4f6; /* Equivalent to gray-50 */
  --card-bg: #ffffff;
  --card-foreground: #1f2937; /* Default text color */
}

/* Base Styles */
body {
  background-color: var(--body-bg);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: #374151; /* text-gray-700 equivalent */
}

.main-container {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 4rem 1rem; /* px-4 py-16 */
}

.content-wrapper {
  max-width: 64rem; /* max-w-4xl equivalent */
  margin-left: auto;
  margin-right: auto;
}

/* Heading */
.main-heading {
  font-size: 2.25rem; /* text-4xl */
  font-weight: 700; /* font-bold */
  color: var(--military-primary);
  margin-bottom: 2rem; /* mb-8 */
  text-align: center;
}

/* Message Card (The main container with border/shadow) */
.message-card {
  border-radius: 0.5rem; /* rounded-lg */
  border: 1px solid #e5e7eb; /* border */
  background-color: var(--card-bg);
  color: var(--card-foreground);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); /* shadow-sm */
  margin-bottom: 2rem; /* mb-8 */
}

.card-body {
  padding: 1.5rem; /* p-6 */
  padding-top: 0;
}

.content-section {
  display: flex;
  gap: 1.5rem; /* gap-6 */
  align-items: flex-start;
  margin-bottom: 1.5rem; /* added for spacing */
}

@media (max-width: 767px) {
  .content-section {
    flex-direction: column; /* md:flex-row gap handling */
    align-items: center;
  }
}


/* Photo and Message Columns */
.image-column {
  flex-basis: 33.333333%; /* md:w-1/3 */
  max-width: 33.333333%;
}

@media (max-width: 767px) {
  .image-column {
    width: 100%;
    max-width: 50%; /* Adjust for better mobile appearance if needed */
  }
}

.director-photo {
  max-width: 100%;
  height: auto;
  border-radius: 0.5rem; /* Optional: for softer look */
}

.message-column {
  flex-basis: 66.666667%; /* md:w-2/3 */
  padding-top: 0;
  line-height: 1.5;
}

.message-title {
  font-weight: 600; /* font-semibold */
  letter-spacing: -0.025em; /* tracking-tight */
  font-size: 1.5rem; /* text-2xl */
  color: var(--military-primary);
  margin-bottom: 1rem; /* space-y-4 equivalent */
  margin-top: 0;
}

.message-text {
  font-size: 1.125rem; /* text-lg */
  line-height: 1.625; /* leading-relaxed */
  color: #4b5563; /* text-gray-700 equivalent */
  margin-bottom: 1rem; /* space-y-4 equivalent */
  margin-top: 0;
}


/* Vision Section (Highlighted Box) */
.vision-box {
  background-color: rgba(184, 134, 11, 0.1); /* bg-military-secondary/10 */
  padding: 1.5rem; /* p-6 */
  border-radius: 0.5rem; /* rounded-lg */
  margin-top: 1.5rem; /* space-y-6 equivalent */
  margin-bottom: 1.5rem;
}

.vision-box .message-text {
    margin-bottom: 1rem;
}

/* Signature */
.signature-block {
  text-align: right;
  margin-top: 1.5rem; /* space-y-6 equivalent */
}

.signature-name, .signature-designation {
  font-weight: 600; /* font-semibold */
  color: var(--military-primary);
  margin: 0;
  line-height: 1.4;
}

.signature-school {
  color: var(--military-secondary);
  margin: 0;
  line-height: 1.4;
}