/*
Theme Name: Sarvmangla Foundation — Objectives
Theme URI: https://sarvmanglafoundation.org
Author: Sarvmangla Foundation
Description: Clean, non-commercial one-page theme for Sarvmangla Foundation presenting the society's Memorandum of Association — its details and 17 official objectives — in Hindi and English. No forms, no services, no donation elements. Mobile responsive with gentle vedic-inspired animation.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: sarvmangla-objectives
Tags: one-column, custom-logo, custom-colors
*/

:root {
  --smo-primary: #ff9933;
  --smo-deep: #7a1f1f;
  --smo-gold: #d4a017;
  --smo-cream: #fff7ea;
  --smo-ink: #2d2016;
  --smo-radius: 14px;
  --smo-shadow: 0 8px 26px rgba(122, 31, 31, .12);
  --smo-anim: 1;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: "Noto Sans Devanagari", "Mukta", Georgia, "Times New Roman", serif;
  color: var(--smo-ink);
  background: var(--smo-cream);
  line-height: 1.7;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; }
a { color: var(--smo-deep); }

.smo-container { max-width: 1140px; margin: 0 auto; padding: 0 20px; }

/* ---------- Header ---------- */
.smo-header {
  position: sticky; top: 0; z-index: 100;
  background: linear-gradient(90deg, var(--smo-deep), #4a1010);
  color: #fff; box-shadow: 0 2px 14px rgba(0,0,0,.25);
}
.smo-header-in { display: flex; align-items: center; gap: 18px; padding: 10px 20px; max-width: 1140px; margin: 0 auto; flex-wrap: wrap; }
.smo-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; color: #fff; }
.smo-brand img { height: 46px; width: auto; border-radius: 50%; background: #fff; }
.smo-brand .om-mark { font-size: 1.9rem; color: var(--smo-primary); }
.smo-brand b { font-size: 1.1rem; letter-spacing: .3px; }
.smo-nav { margin-left: auto; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.smo-nav a { color: #ffe7c2; text-decoration: none; font-size: .95rem; }
.smo-nav a:hover { color: var(--smo-primary); }
.smo-lang { display: flex; gap: 4px; border: 1px solid rgba(255,153,51,.6); border-radius: 20px; padding: 3px; }
.smo-lang a { padding: 2px 12px; border-radius: 16px; font-size: .85rem; text-decoration: none; color: #ffe7c2; }
.smo-lang a.on { background: var(--smo-primary); color: #241000; font-weight: 700; }

/* ---------- Hero ---------- */
.smo-hero {
  position: relative; overflow: hidden; text-align: center;
  padding: 90px 20px 100px;
  background: radial-gradient(ellipse at 50% 120%, #3a0d0d 0%, #1a0b26 55%, #0d0618 100%);
  color: #fdf3e3;
}
.smo-hero .om {
  font-size: 4rem; color: var(--smo-primary); display: inline-block;
  text-shadow: 0 0 30px rgba(255,153,51,.8);
  animation: smo-glow calc(4s / var(--smo-anim)) ease-in-out infinite;
}
.smo-hero h1 { font-size: clamp(1.9rem, 5vw, 3.2rem); margin: 10px 0 6px; color: #ffd9a0; }
.smo-hero .shloka { color: var(--smo-gold); font-style: italic; margin: 14px 0 8px; font-size: 1.05rem; }
.smo-hero .sub { max-width: 720px; margin: 0 auto; opacity: .95; }
.smo-hero .badge {
  display: inline-block; margin-top: 26px; padding: 10px 26px; border-radius: 30px;
  border: 1px solid var(--smo-gold); color: #ffe7b0; font-weight: 700; letter-spacing: .5px;
  background: rgba(212,160,23,.12);
}
.smo-stars { position: absolute; inset: 0; pointer-events: none; }
.smo-stars span {
  position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #ffe9c9;
  animation: smo-twinkle calc(3.5s / var(--smo-anim)) ease-in-out infinite;
}
@keyframes smo-glow { 0%,100% { text-shadow: 0 0 18px rgba(255,153,51,.5); } 50% { text-shadow: 0 0 44px rgba(255,153,51,1); } }
@keyframes smo-twinkle { 0%,100% { opacity: .15; } 50% { opacity: .95; } }

/* ---------- Sections ---------- */
.smo-section { padding: 72px 0; }
.smo-title { text-align: center; font-size: clamp(1.5rem, 4vw, 2.2rem); color: var(--smo-deep); margin-bottom: 8px; }
.smo-title .orn { display: block; color: var(--smo-primary); font-size: 1rem; letter-spacing: 8px; margin-bottom: 6px; }
.smo-subtitle { text-align: center; color: #7c6650; max-width: 680px; margin: 0 auto 40px; }

/* MoA details */
.smo-moa { background: linear-gradient(180deg, #fff, var(--smo-cream)); }
.smo-moa-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.smo-moa-card {
  background: #fff; border-radius: var(--smo-radius); box-shadow: var(--smo-shadow);
  padding: 22px 18px; text-align: center; border-top: 4px solid var(--smo-primary);
}
.smo-moa-card .ic { font-size: 1.8rem; }
.smo-moa-card h3 { color: var(--smo-deep); font-size: .95rem; margin: 8px 0 4px; }
.smo-moa-card p { font-size: .95rem; color: #4d3d2e; word-break: break-word; }

/* Objectives */
.smo-obj { background: #fdf1dd; }
.smo-obj-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.smo-obj-card {
  background: #fff; border-radius: var(--smo-radius); box-shadow: var(--smo-shadow);
  padding: 24px; display: flex; gap: 16px; align-items: flex-start;
  transition: transform .3s ease, box-shadow .3s ease;
}
.smo-obj-card:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(122,31,31,.2); }
.smo-obj-card .num {
  flex: 0 0 auto; width: 46px; height: 46px; border-radius: 50%;
  background: linear-gradient(135deg, var(--smo-primary), var(--smo-gold));
  color: #241000; font-weight: 800; display: flex; align-items: center; justify-content: center;
  font-size: 1.05rem; box-shadow: 0 4px 12px rgba(212,160,23,.4);
}
.smo-obj-card .ic { font-size: 1.5rem; margin-left: 6px; }
.smo-obj-card h3 { color: var(--smo-deep); font-size: 1.05rem; margin-bottom: 6px; }
.smo-obj-card p { font-size: .93rem; color: #4d3d2e; }

/* Not-for-profit band */
.smo-nfp {
  background: linear-gradient(90deg, var(--smo-deep), #94301f, var(--smo-deep));
  color: #ffe7c2; text-align: center; padding: 46px 20px;
}
.smo-nfp .om { color: var(--smo-primary); font-size: 2rem; }
.smo-nfp h2 { font-size: clamp(1.2rem, 3.4vw, 1.8rem); margin: 8px 0; }

/* Contact */
.smo-contact { background: linear-gradient(180deg, var(--smo-cream), #fff); }
.smo-contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: 900px; margin: 0 auto; }

/* Footer */
.smo-footer { background: #1a0b26; color: #cbb8a0; text-align: center; padding: 30px 20px; font-size: .9rem; }
.smo-footer .om { color: var(--smo-primary); }

/* Reveal on scroll */
.smo-reveal { opacity: 0; transform: translateY(26px); transition: opacity calc(.7s / var(--smo-anim)) ease, transform calc(.7s / var(--smo-anim)) ease; }
.smo-reveal.in { opacity: 1; transform: none; }
body.smo-no-anim .smo-reveal { opacity: 1; transform: none; }
body.smo-no-anim .smo-hero .om, body.smo-no-anim .smo-stars span { animation: none; }

/* Inner pages fallback */
.smo-page { padding: 60px 0; }
.smo-page h1 { color: var(--smo-deep); margin-bottom: 18px; }

/* ---------- Responsive ---------- */
@media (max-width: 991px) {
  .smo-moa-grid { grid-template-columns: repeat(2, 1fr); }
  .smo-contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .smo-obj-grid { grid-template-columns: 1fr; }
  .smo-nav { gap: 12px; font-size: .9rem; }
  .smo-hero { padding: 64px 16px 72px; }
}
@media (max-width: 520px) {
  .smo-moa-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .smo-hero .om, .smo-stars span { animation: none !important; }
  .smo-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}