/* About > Awards — layout comes from the shared .sp-* kit in base.css
   Fonts / weights / sizes now match the Home page:
     Headings        = Marcellus, 400, UPPERCASE  (same as "ABOUT US", "OUR SCHOOL HIGHLIGHTS")
     Normal text     = Playfair Display (var(--font-body)), 400, 1.22rem, line-height 1.9, 0.15px stroke
     Names           = same Playfair Display text, uppercase
   Colours are NOT changed. */
@import url("https://fonts.googleapis.com/css2?family=Marcellus&family=Plus+Jakarta+Sans:ital,wght@0,400;1,400&family=Playfair+Display:wght@400;500&display=swap");

:root {
  --aw-red: #d32f2f;
  --aw-panel: #eaf1fb;
  --aw-head: "Marcellus", var(--font-head, serif);
  --aw-text: "Playfair Display", Georgia, serif;
}

/* ---------- Page title: "OUR AWARDS" (same look as the Home section titles) ---------- */
.sp-page.theme-blue h1:not(.sp-hero h1) {
  font-family: var(--aw-head);
  font-size: clamp(2rem, 4vw, 3.1rem);
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: 0.01em;
  color: var(--aw-red);
  display: block;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 4px;
  border-bottom: 3px solid var(--aw-red);
}
/* remove the old small gradient bar under the title */
.sp-page.theme-blue h1:not(.sp-hero h1)::before,
.sp-page.theme-blue h1:not(.sp-hero h1)::after,
.sp-page.theme-blue :has(> h1:not(.sp-hero h1))::before,
.sp-page.theme-blue :has(> h1:not(.sp-hero h1))::after {
  content: none !important;
  display: none !important;
}
.sp-page.theme-blue h1:not(.sp-hero h1) ~ * { display: none !important; }

/* ---------- Placeholder / image frame ---------- */
.aw-ph {
  position: relative;
  margin: 0;
  width: 100%;
  max-width: var(--w, 100%);
  aspect-ratio: var(--ratio, 4 / 3);
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(135deg, #eef2f7, #dde5ef);
  border: 2px dashed #b6c3d6;
  box-shadow: 0 10px 28px rgba(15, 40, 80, .10);
}
.aw-ph img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  z-index: 2;
}
.aw-ph:has(img) { border: 0; }
.aw-ph-label {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #6b7c93;
  font-family: var(--aw-text);
  font-size: .95rem;
  font-weight: 400;
  letter-spacing: .02em;
}
.aw-ph-label i { font-size: 1.8rem; opacity: .7; }

/* ---------- Text panel (coloured shape, like the Home "About Us" box) ---------- */
.aw-panel {
  background: var(--aw-panel);
  border-radius: 40px 160px 40px 40px;
  padding: 36px 40px;
}

/* ---------- Feature (image + text) ---------- */
.aw-feature {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 40px;
  align-items: center;
  margin: 48px 0;
}
.aw-feature .aw-ph { justify-self: center; }

/* ---------- Headings: Marcellus, caps, 400, red underline, no icons ---------- */
.aw-body h3,
.aw-block-head h3 {
  display: inline-block;
  font-family: var(--aw-head);
  font-size: clamp(1.2rem, 1.9vw, 2rem);   /* a little smaller so every heading fits on ONE line */
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  line-height: 1.15;
  white-space: nowrap;                      /* heading always stays on a single straight line */
  color: var(--aw-red);
  padding-bottom: 4px;
  border-bottom: 3px solid var(--aw-red);
  margin: 0 0 18px;
}

/* ---------- Paragraphs: same as Home paragraphs ---------- */
.sp-page .aw-body p,
.sp-page .aw-block-head p {
  font-family: "Playfair Display", Georgia, serif !important;
  font-size: 1.22rem;
  font-weight: 400;
  font-style: normal;
  line-height: 1.9;
  letter-spacing: normal;
  text-transform: none;
  -webkit-text-stroke: 0.15px currentColor;
  color: #000;
  margin: 0 0 12px;
}
.sp-page .aw-body p:last-child,
.sp-page .aw-block-head p:last-child { margin-bottom: 0; }

/* "received from / by / in the year" lines */
.sp-page .aw-body p.aw-recv {
  font-size: 1.22rem;
  line-height: 1.9;
  margin: 0 0 6px;
}

/* Names: same style as the highlighted words in the Home About paragraph */
.sp-page .aw-name {
  font-family: "Playfair Display", Georgia, serif !important;
  font-weight: 400;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  -webkit-text-stroke: 0.15px currentColor;
  color: #000;
  white-space: nowrap;              /* "GARU" always stays on the same line as the name */
}
.aw-name-lg { font-size: 1.1em; }   /* Sri N. Chandrababu Naidu garu */
.aw-name-md { font-size: 1em; }     /* M. Kamalakar Rao Garu — a little smaller */

/* ---------- Block (heading + media) ---------- */
.aw-block { margin: 56px 0; }
.aw-block-head { text-align: center; max-width: 720px; margin: 0 auto 24px; }

/* ---------- Best Teachers: image | heading + image | image ---------- */
.aw-teachers {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}
.aw-teachers .aw-t1 { grid-column: 1; grid-row: 1; }
.aw-teachers .aw-t-center { grid-column: 2; grid-row: 1; }
.aw-teachers .aw-t3 { grid-column: 3; grid-row: 1; }
.aw-teachers .aw-t-center .aw-block-head { margin: 0 0 20px; max-width: none; padding: 28px 24px; }
.aw-teachers .aw-t-center .aw-block-head h3 { font-size: clamp(1.1rem, 1.55vw, 1.9rem); }   /* narrower centre panel */

/* ---------- Chekumuki + Inspire: text panels on top, images below (1280 x 1280) ---------- */
.aw-pair {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 28px 40px;
  margin: 56px 0 24px;
  align-items: stretch;
}
.aw-pair .aw-p-text1 { grid-column: 1; grid-row: 1; }
.aw-pair .aw-p-text2 { grid-column: 2; grid-row: 1; }
.aw-pair .aw-p-img1  { grid-column: 1; grid-row: 2; justify-self: center; max-width: 560px; }
.aw-pair .aw-p-img2  { grid-column: 2; grid-row: 2; justify-self: center; max-width: 560px; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  /* single column: scale the heading with the screen so it still stays on one line */
  .aw-body h3, .aw-block-head h3,
  .aw-teachers .aw-t-center .aw-block-head h3 { font-size: clamp(0.8rem, 3.9vw, 1.6rem); }

  .aw-feature { grid-template-columns: 1fr; gap: 24px; margin: 36px 0; }
  .aw-panel { padding: 28px 24px; border-radius: 32px 96px 32px 32px; }

  .aw-teachers { grid-template-columns: 1fr; gap: 20px; }
  .aw-teachers .aw-t-center { grid-column: 1; grid-row: 1; }
  .aw-teachers .aw-t1 { grid-column: 1; grid-row: 2; }
  .aw-teachers .aw-t3 { grid-column: 1; grid-row: 3; }

  .aw-pair { grid-template-columns: 1fr; gap: 20px; }
  .aw-pair .aw-p-text1 { grid-column: 1; grid-row: 1; }
  .aw-pair .aw-p-img1  { grid-column: 1; grid-row: 2; }
  .aw-pair .aw-p-text2 { grid-column: 1; grid-row: 3; }
  .aw-pair .aw-p-img2  { grid-column: 1; grid-row: 4; }
}
@media (max-width: 700px) {
  /* same mobile size step-down as the Home paragraphs */
  .sp-page .aw-body p, .sp-page .aw-block-head p, .sp-page .aw-body p.aw-recv { font-size: 1.05rem; }
}
@media (max-width: 560px) {
  .aw-name { white-space: normal; }   /* tiny screens: allow wrapping so nothing overflows */
}

/* Featured section sits right under the page title */
.aw-first { padding-top: 10px; }
.aw-first .aw-feature:first-child { margin-top: 10px; }