/* HPH Dhivehi interior pages — visual direction inherited from the locked homepage. */
:root {
  --ink: #101d31;
  --ink-deep: #081426;
  --ink-soft: #18324b;
  --aqua: #42a7c7;
  --aqua-bright: #65ceda;
  --paper: #f7f5f0;
  --mist: #edf5f5;
  --sky: #e8f2f5;
  --warm: #f4eadf;
  --sage: #e6efe8;
  --line: #d5dde1;
  --muted: #5d6876;
  --shadow: 0 28px 80px rgba(8, 20, 38, .12);
}

html[lang="dv"] body.interior-page {
  overflow-x: clip;
  background: var(--paper);
  color: var(--ink);
  font-family: "MV Waheed", system-ui, sans-serif;
  font-size: 18px;
  line-height: 1.9;
}

.interior-page .container { width: min(calc(100% - var(--gutter) * 2), 1260px); }

/* Header: compact, precise and visually continuous with the approved homepage. */
.interior-page .page-header {
  position: fixed;
  inset: 0 0 auto;
  background: linear-gradient(180deg, rgba(6, 18, 34, .96), rgba(6, 18, 34, .82));
  border-color: rgba(255, 255, 255, .13);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .04);
  backdrop-filter: blur(18px) saturate(125%);
}
.interior-page .header-inner { height: 88px; gap: 26px; }
.interior-page .brand-lockup { gap: 14px; direction: ltr; }
.interior-page .brand-lockup img { width: 54px; height: 54px; }
.interior-page .brand-lockup strong { font: 600 22px/1 "Plus Jakarta Sans", system-ui, sans-serif; letter-spacing: .035em; }
.interior-page .brand-lockup small { margin-top: 6px; font: 500 9px/1 "Plus Jakarta Sans", system-ui, sans-serif; letter-spacing: .18em; }
.interior-page .main-nav { gap: clamp(13px, 1.35vw, 23px); font-size: 13px; }
.interior-page .main-nav > a,
.interior-page .mega > summary { position: relative; padding: 30px 0 27px; }
.interior-page .main-nav > a::after,
.interior-page .mega > summary::before {
  content: ""; position: absolute; right: 0; bottom: 19px; width: 0; height: 1px;
  background: var(--aqua-bright); transition: width .25s ease;
}
.interior-page .main-nav > a:hover::after,
.interior-page .main-nav > a[aria-current="page"]::after,
.interior-page .mega > summary:hover::before { width: 100%; }
.interior-page .header-donate { padding: 12px 19px; background: var(--aqua); }
.interior-page .mega-panel {
  top: 75px; border-top: 2px solid var(--aqua); border-radius: 0 0 2px 2px;
  box-shadow: 0 28px 75px rgba(0, 0, 0, .28);
}
.interior-page .mega-intro { background: linear-gradient(145deg, var(--sky), #fff); }

/* Cinematic heroes: every page has a unique image; compositions alternate by purpose. */
.interior-page .page-hero {
  min-height: clamp(660px, 79vh, 820px);
  background: var(--ink-deep);
  color: #fff;
}
.interior-page .page-hero .hero-grid { min-height: inherit; }
.interior-page .page-hero .hero-copy {
  position: relative; z-index: 3; display: flex; flex-direction: column; justify-content: center;
  min-height: inherit; width: min(720px, 58vw); max-width: none;
  padding: 150px clamp(34px, 4vw, 66px) 92px;
}
.interior-page .page-hero h1 {
  max-width: 14ch; margin: 0; color: #fff;
  font-size: clamp(48px, 5.2vw, 76px); font-weight: 400; line-height: 1.28;
  letter-spacing: 0; text-shadow: 0 4px 32px rgba(0, 0, 0, .28);
}
.interior-page .page-hero h1 strong { color: #fff; font-weight: 600; }
.interior-page .page-hero .eyebrow {
  margin-bottom: 22px; color: var(--aqua-bright); font-size: 14px; line-height: 1.6;
}
.interior-page .page-hero .eyebrow::before { width: 34px; height: 1px; background: var(--aqua-bright); }
.interior-page .page-hero .lead {
  max-width: 52ch; margin-top: 26px; color: rgba(244, 248, 251, .88);
  font-size: clamp(18px, 1.45vw, 21px); line-height: 1.9; text-shadow: 0 2px 20px rgba(0, 0, 0, .2);
}
.interior-page .page-hero .hero-actions { gap: 12px; margin-top: 32px; }
.interior-page .page-hero .button { min-height: 51px; padding: 0 24px; }
.interior-page .page-hero .hero-art.hero-photo::after { content: ""; }
.interior-page .page-hero .hero-photo img {
  filter: saturate(.9) contrast(1.04); transform: scale(1.01);
  animation: hph-interior-breathe 16s ease-in-out infinite alternate;
}
.interior-page .page-hero .hero-photo .art-label {
  right: auto; left: max(var(--gutter), calc((100vw - 1260px) / 2)); bottom: 26px;
  max-width: min(500px, 45vw); padding: 9px 13px;
  border: 1px solid rgba(255, 255, 255, .22); background: rgba(6, 18, 34, .52);
  color: rgba(255, 255, 255, .88); font-size: 12px; backdrop-filter: blur(10px);
}
.interior-page.hero-left .hero-copy { margin-left: auto; margin-right: 0; }
.interior-page.hero-left .page-hero .hero-art::after {
  background: linear-gradient(270deg, rgba(5, 17, 33, .96) 0%, rgba(5, 17, 33, .82) 39%, rgba(5, 17, 33, .29) 72%, rgba(5, 17, 33, .08) 100%), linear-gradient(180deg, rgba(3, 13, 26, .22), rgba(3, 13, 26, .38));
}
.interior-page.hero-right .hero-copy { margin-right: auto; margin-left: 0; }
.interior-page.hero-right .page-hero .hero-art::after {
  background: linear-gradient(90deg, rgba(5, 17, 33, .96) 0%, rgba(5, 17, 33, .82) 39%, rgba(5, 17, 33, .29) 72%, rgba(5, 17, 33, .08) 100%), linear-gradient(180deg, rgba(3, 13, 26, .22), rgba(3, 13, 26, .38));
}
.interior-page.hero-band .page-hero { min-height: clamp(700px, 84vh, 860px); }
.interior-page.hero-band .hero-copy {
  width: min(100%, 1060px); min-height: auto; margin: 0; padding: clamp(390px, 48vh, 500px) 0 76px;
}
.interior-page.hero-band .hero-copy::before {
  content: ""; position: absolute; z-index: -1; right: -100vw; left: -100vw; top: clamp(350px, 44vh, 460px); bottom: 0;
  background: linear-gradient(90deg, rgba(7, 21, 40, .96), rgba(13, 38, 59, .88));
  border-top: 1px solid rgba(255, 255, 255, .14);
}
.interior-page.hero-band .page-hero h1 { max-width: 18ch; font-size: clamp(46px, 4.7vw, 68px); }
.interior-page.hero-band .page-hero .lead { max-width: 64ch; }
.interior-page.hero-band .page-hero .hero-art::after {
  background: linear-gradient(180deg, rgba(4, 15, 29, .16) 0%, rgba(4, 15, 29, .12) 52%, rgba(4, 15, 29, .78) 100%);
}

@keyframes hph-interior-breathe { from { transform: scale(1.01); } to { transform: scale(1.055); } }

/* Editorial content system: light, varied and readable rather than report-like. */
.interior-page .section { position: relative; padding: clamp(82px, 9vw, 126px) 0; }
.interior-page .section.light { background: #fff; }
.interior-page .section.sky { background: linear-gradient(145deg, #edf6f7, #e5f0f3); }
.interior-page .section.warm { background: linear-gradient(145deg, #f8f0e7, #f2e7da); }
.interior-page .section.sage { background: linear-gradient(145deg, #ecf3ec, #e3ede5); }
.interior-page .section.dark { background: linear-gradient(145deg, #0e1b2e, #132d45); }
.interior-page .section-intro { gap: clamp(42px, 7vw, 110px); margin-bottom: clamp(48px, 6vw, 76px); }
.interior-page .section-heading,
.interior-page .profile-copy h2,
.interior-page .form-copy h2 {
  font-size: clamp(38px, 4vw, 58px); font-weight: 400; line-height: 1.42; letter-spacing: 0;
}
.interior-page .section-heading strong,
.interior-page .profile-copy h2 strong,
.interior-page .form-copy h2 strong { font-weight: 600; }
.interior-page .section-intro > p { font-size: 18px; line-height: 1.95; }
.interior-page .statement { gap: clamp(52px, 7vw, 96px); }
.interior-page .statement blockquote { font-size: clamp(34px, 3.8vw, 53px); font-weight: 400; line-height: 1.5; letter-spacing: 0; }
.interior-page .statement blockquote strong { font-weight: 600; }
.interior-page .statement-aside { padding: 30px 34px; border-right: 1px solid var(--aqua); border-left: 0; }
.interior-page .feature-grid { gap: 16px; border: 0; background: transparent; }
.interior-page .feature-card {
  min-height: 350px; padding: 38px; border: 1px solid rgba(13, 36, 56, .11);
  box-shadow: 0 14px 38px rgba(8, 20, 38, .055);
}
.interior-page .feature-card.accent { background: linear-gradient(145deg, var(--ink), var(--ink-soft)); }
.interior-page .feature-card .icon { border-color: rgba(66, 167, 199, .65); }
.interior-page .feature-card b { margin-top: 56px; }
.interior-page .feature-card h3 { font-size: 25px; line-height: 1.55; }
.interior-page .feature-card p { font-size: 16px; line-height: 1.9; }
.interior-page .editorial-row { grid-template-columns: 64px minmax(230px, .78fr) minmax(320px, 1.22fr) 30px; padding: 36px 0; }
.interior-page .editorial-row h3 { font-size: clamp(21px, 2vw, 28px); line-height: 1.55; letter-spacing: 0; }
.interior-page .editorial-row p { line-height: 1.9; }
.interior-page .process-band { gap: 1px; border-color: rgba(12, 35, 54, .15); background: rgba(12, 35, 54, .14); }
.interior-page .process-step { min-height: 300px; padding: 34px; border: 0; background: rgba(255, 255, 255, .72); }
.interior-page .process-step h3 { margin-top: 68px; font-size: 24px; line-height: 1.55; letter-spacing: 0; }
.interior-page .process-step p { font-size: 15px; line-height: 1.85; }
.interior-page .metric-grid { gap: 1px; background: var(--line); }
.interior-page .metric { border: 0; background: #fff; }
.interior-page .form-panel { border: 0; box-shadow: var(--shadow); }
.interior-page .profile-photo img { box-shadow: var(--shadow); }
.interior-page .page-cta { padding: clamp(82px, 9vw, 118px) 0; background: linear-gradient(130deg, #0b182a, #15334c); }
.interior-page .page-cta h2 { font-size: clamp(38px, 4.4vw, 60px); font-weight: 400; line-height: 1.42; letter-spacing: 0; }

/* Footer follows the homepage's restrained navy close. */
.interior-page .site-footer { background: #071426; padding-top: 78px; }
.interior-page .site-footer .brand-lockup img { width: 58px; height: 58px; }
.interior-page .footer-column h3 { color: var(--aqua-bright); font-size: 13px; text-transform: none; letter-spacing: 0; }
.interior-page .footer-column a { color: #d6e0e8; line-height: 1.8; }

@media (max-width: 1080px) {
  .interior-page .main-nav { display: none; }
  .interior-page .menu-button { display: block; }
  .interior-page .page-hero .hero-copy { width: min(760px, 76vw); }
}

@media (max-width: 800px) {
  .interior-page .header-inner { height: 76px; }
  .interior-page .brand-lockup img { width: 48px; height: 48px; }
  .interior-page .brand-lockup strong { font-size: 20px; }
  .interior-page .page-hero,
  .interior-page.hero-band .page-hero { min-height: 690px; }
  .interior-page .page-hero .hero-copy,
  .interior-page.hero-left .hero-copy,
  .interior-page.hero-right .hero-copy,
  .interior-page.hero-band .hero-copy {
    width: 100%; min-height: 690px; margin: 0; padding: 132px 0 104px; justify-content: flex-end;
  }
  .interior-page .page-hero h1,
  .interior-page.hero-band .page-hero h1 { max-width: 13ch; font-size: clamp(42px, 12.4vw, 62px); line-height: 1.32; }
  .interior-page .page-hero .lead { max-width: 96%; font-size: 18px; line-height: 1.82; }
  .interior-page .page-hero .hero-art::after,
  .interior-page.hero-left .page-hero .hero-art::after,
  .interior-page.hero-right .page-hero .hero-art::after,
  .interior-page.hero-band .page-hero .hero-art::after {
    background: linear-gradient(180deg, rgba(5, 17, 33, .15) 0%, rgba(5, 17, 33, .42) 42%, rgba(5, 17, 33, .96) 78%, rgba(5, 17, 33, .99) 100%);
  }
  .interior-page.hero-band .hero-copy::before { content: none; }
  .interior-page .page-hero .hero-photo .art-label { right: var(--gutter); left: auto; bottom: 18px; max-width: calc(100% - var(--gutter) * 2); }
  .interior-page .section-intro,
  .interior-page .statement,
  .interior-page .form-layout,
  .interior-page .cta-inner { grid-template-columns: 1fr; }
  .interior-page .section-heading,
  .interior-page .profile-copy h2,
  .interior-page .form-copy h2 { font-size: clamp(34px, 9vw, 46px); line-height: 1.48; }
  .interior-page .statement blockquote { font-size: clamp(31px, 8vw, 42px); }
  .interior-page .editorial-row { grid-template-columns: 44px 1fr 20px; }
  .interior-page .editorial-row p { grid-column: 2 / 4; }
}

@media (max-width: 480px) {
  .interior-page .brand-lockup small { display: none; }
  .interior-page .page-hero .hero-actions { align-items: stretch; }
  .interior-page .page-hero .button { width: 100%; }
  .interior-page .feature-card { min-height: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .interior-page .page-hero .hero-photo img { animation: none; transform: scale(1.015); }
}
