/* ════════════════════════════════════════════════════
   style.css  —  TVK Campaign  |  Red & Yellow Theme
   ════════════════════════════════════════════════════ */

/* ── Reset & Base ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
/* ═══════════════════════════════════════
   CUSTOM FONT
═══════════════════════════════════════ */
@font-face {
    font-family: 'Anton';
    src: url('../font/tau_fonts/TAU-Neythal-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Paalai';
    src: url('../font/tau_fonts/TAU-Paalai.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* ═══════════════════════════════════════
   ROOT VARIABLES
═══════════════════════════════════════ */
:root {

  --yellow:       #f5c800;
  --yellow-light: #ffe566;
  --yellow-dark:  #c49e00;
  --yellow-deep:  #e6b800;

  --red:          #c0000c;
  --red-light:    #e8001a;
  --red-dark:     #7a0008;

  --gold:         #f5c518;

  --black:        #3a0005;
  --dark:         #7a0008;
  --dark2:        #f5c800;

  --white:        #ffffff;
  --gray:         rgba(80,20,0,0.55);

  --nav-h:        72px;

  /* Fonts */
  --font-display: 'Anton', sans-serif;
  --font-body: 'Paalai', sans-serif;
  --font-tamil: 'Noto Sans Tamil', sans-serif;

  /* Animation */
  --ease: cubic-bezier(.4,0,.2,1);
} 


html { scroll-behavior:smooth; }
body { font-family:var(--font-body); background:white; color:var(--white); overflow-x:hidden; -webkit-font-smoothing:antialiased; }
a   { text-decoration:none; color:inherit; }
ul  { list-style:none; }
img { display:block; max-width:100%; }

/* ══ NAVBAR ══ */
.site-header{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;

    background: linear-gradient(
        135deg,
        #b0000b 0%,
        #8a0008 40%,
        #6a0006 100%
    );

    transition:
        background .4s var(--ease),
        box-shadow .4s var(--ease);
}
.site-header.scrolled { box-shadow:0 2px 28px rgba(0,0,0,.4); backdrop-filter:blur(16px); }
.navbar { max-width:1400px; margin:0 auto; height:var(--nav-h); padding:0 1rem; display:flex; align-items:center; justify-content:space-between;  backdrop-filter:blur(10px); border-bottom:1px solid rgba(245,200,0,0.35); }

.nav-logo { display:flex; align-items:center; gap:.65rem; flex-shrink:0; }
.logo-icon .logo { width:60px; height:60px; filter:drop-shadow(0 0 6px rgba(245,200,0,.55)); transition:transform .35s var(--ease); }
.nav-logo:hover .logo-icon svg { transform:rotate(10deg) scale(1.08); }
.logo-text-wrap { display:flex; flex-direction:column; gap:1px; }
.logo-abbr  { font-family:var(--font-display); font-weight:700; font-size:1.82rem; letter-spacing:.03em; color:var(--white); line-height:1.2; }
.logo-sub   { font-size:.92rem; letter-spacing:.12em; color:rgba(245,200,0,.85); text-transform:uppercase; font-family:var(--font-display);}

.nav-links  { display:flex; align-items:center; gap:.25rem; }
.nav-link   { font-family:var(--font-body); font-weight:600; font-size:.98rem; letter-spacing:.12em; color:rgba(255,255,255,.88); padding:.5rem 1rem; border-radius:4px; position:relative; transition:color .2s,background .2s; }
.nav-link::after { content:''; position:absolute; bottom:4px; left:50%; width:0; height:2px; background:var(--yellow); transform:translateX(-50%); border-radius:2px; transition:width .3s var(--ease); }
.nav-link:hover { color:var(--yellow); }
.nav-link:hover::after,.nav-link.active::after { width:55%; }
.nav-link.active { color:var(--white); }

.nav-cta { font-family:var(--font-body); font-weight:700; font-size:.8rem; letter-spacing:.12em; background:var(--yellow); color:var(--red-dark); padding:.55rem 1.4rem; border-radius:4px; flex-shrink:0; transition:background .2s,transform .2s,box-shadow .2s; }
.nav-cta:hover { background:var(--yellow-light); transform:translateY(-2px); box-shadow:0 4px 20px rgba(245,200,0,.5); }

.hamburger { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; }
.hamburger span { display:block; width:26px; height:2px; background:var(--yellow); border-radius:2px; transition:transform .3s var(--ease),opacity .3s; transform-origin:center; }
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

@media(max-width:768px){
  .nav-links { position:fixed; top:70px; right:-100%; width:75%; height:100vh; background:var(--red-dark); flex-direction:column; align-items:flex-start; padding:30px; gap:20px; transition:.4s; z-index:999; }
  .nav-links.active { right:0; }
  .hamburger { display:flex; }
  .hamburger span { width:26px; height:3px; background:var(--yellow); }
  .nav-cta { display:none; }
}

.load-more-btn{
  display:block;
  margin:30px auto 0;
  padding:12px 28px;
  background:linear-gradient(135deg,var(--yellow),var(--yellow-dark));
  color:var(--red-dark);
  font-size:1rem;
  font-weight:800;
  border-radius:40px;
  border:none;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(245,200,0,.45);
  transition:all .3s;
}
/* ══ HERO ══ */
/* ═══════════════════════════════════════
   LEADER ABOUT SECTION
═══════════════════════════════════════ */
.leader-about{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(180deg,#ffffff 0%,#fffdf5 100%);
  padding:65px 0 65px;
}

.leader-about::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(176,0,11,.04) 1px,transparent 1px),
    linear-gradient(rgba(176,0,11,.04) 1px,transparent 1px);
  background-size:38px 38px;
  pointer-events:none;
}

.about-bg-shape{
  position:absolute;
  border-radius:50%;
  z-index:0;
}

.shape-1{
  width:420px;
  height:420px;
  background:rgba(245,200,0,.18);
  top:-180px;
  right:-120px;
}

.shape-2{
  width:280px;
  height:280px;
  background:rgba(176,0,11,.08);
  bottom:-100px;
  left:-90px;
}

.leader-about-container{
  position:relative;
  z-index:2;
  max-width:1250px;
  margin:auto;
  padding:0 30px;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  gap:35px;
}

/* LEFT */
.about-badge{
  display:inline-block;
  background:#fff3c4;
  color:#9b0008;
  border:1px solid rgba(245,200,0,.55);
  padding:9px 18px;
  border-radius:40px;
  font-size:12px;
  font-weight:900;
  letter-spacing:1.3px;
  margin-bottom:18px;
}

.leader-title{
  margin:0;
  font-family:var(--font-display);
  font-size:clamp(3.5rem,7vw,6.8rem);
  line-height:.95;
  color:#f5c800;
}

.leader-title span{
  display:block;
  color:#b0000b;
}

.leader-title small{
  display:block;
  margin-top:14px;
  font-family:var(--font-body);
  font-size:clamp(1.3rem,2.2vw,2rem);
  line-height:1.4;
  color:#7a0008;
  font-weight:800;
}

.leader-subtitle{
  margin:25px 0 12px;
  font-family:var(--font-body);
  font-size:1.25rem;
  font-weight:900;
  color:#c0000c;
}

.leader-desc{
  max-width:650px;
  margin:0;
  font-family:var(--font-body);
  font-size:1.02rem;
  line-height:1.9;
  color:#444;
}

.leader-highlights{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin-top:28px;
}

.highlight-card{
  background:#fff;
  border-radius:18px;
  padding:18px 16px;
  border:1px solid rgba(176,0,11,.08);
  box-shadow:0 12px 30px rgba(0,0,0,.06);
  border-bottom:4px solid #f5c800;
}

.highlight-card strong{
  display:block;
  font-family:var(--font-body);
  color:#7a0008;
  font-size:15px;
  margin-bottom:5px;
}

.highlight-card span{
  font-size:12px;
  font-weight:800;
  color:#777;
  letter-spacing:.5px;
}

.hero-actions{
  display:flex;
  gap:15px;
  flex-wrap:wrap;
  margin-top:30px;
}

.btn-primary,
.btn-outline{
  min-height:48px;
  padding:0 27px;
  border-radius:50px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  font-size:12px;
  font-weight:900;
  letter-spacing:1.2px;
  transition:.3s ease;
}

.btn-primary{
  background:linear-gradient(135deg,#b0000b,#6a0006);
  color:#fff;
  box-shadow:0 12px 28px rgba(176,0,11,.22);
}

.btn-primary:hover{
  transform:translateY(-3px);
}

.btn-outline{
  background:#fff;
  color:#b0000b;
  border:2px solid #b0000b;
}

.btn-outline:hover{
  background:#b0000b;
  color:#fff;
}

/* RIGHT VISUAL */
.leader-about-visual{
  position:relative;
  min-height:570px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
}

.leader-circle{
  position:absolute;
  width:430px;
  height:430px;
  border-radius:50%;
  background:
    radial-gradient(circle,#ffe566 0%,#f5c800 48%,rgba(245,200,0,.18) 70%);
  bottom:35px;
  opacity:.9;
}

.leader-circle::after{
  content:"";
  position:absolute;
  inset:-32px;
  border-radius:50%;
  border:2px dashed rgba(176,0,11,.18);
}

.leader-image-card{
  position:relative;
  z-index:3;
  width:100%;
  display:flex;
  justify-content:center;
  align-items:flex-end;
}

.leader-image-card img{
  max-height:610px;
  max-width:100%;
  object-fit:contain;
  filter:drop-shadow(0 25px 35px rgba(0,0,0,.20));
}

.symbol-badge{
  position:absolute;
  z-index:5;
  right:50px;
  bottom:70px;
  width:96px;
  height:96px;
  background:#fff;
  border:5px solid #f5c800;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 18px 35px rgba(0,0,0,.18);
}

.symbol-badge img{
  width:64px;
  height:64px;
  object-fit:contain;
}

/* RESPONSIVE */
@media(max-width:991px){
  .leader-about{
    padding:85px 0 45px;
  }

  .leader-about-container{
    grid-template-columns:1fr;
    text-align:center;
    gap:25px;
  }

  .leader-desc{
    margin:auto;
  }

  .leader-highlights{
    grid-template-columns:1fr;
    max-width:420px;
    margin:25px auto 0;
  }

  .hero-actions{
    justify-content:center;
  }

  .leader-about-visual{
    min-height:auto;
  }

  .leader-circle{
    width:310px;
    height:310px;
    bottom:15px;
  }

  .leader-image-card img{
    max-height:430px;
  }

  .symbol-badge{
    right:20%;
    bottom:45px;
    width:78px;
    height:78px;
  }

  .symbol-badge img{
    width:50px;
    height:50px;
  }
}

@media(max-width:576px){
  .leader-about-container{
    padding:0 20px;
  }

  .leader-title{
    font-size:3.4rem;
  }

  .btn-primary,
  .btn-outline{
    width:100%;
  }

  .symbol-badge{
    right:12px;
  }
}
/* ══ FOOTER — red bg ══ */
.site-footer { position:relative; background:linear-gradient(135deg,#c0000c,#7a0008); color:#fff; padding:70px 10px 0; overflow:hidden; }
.footer-bg-overlay { position:absolute; inset:0; background:radial-gradient(circle at top left,rgba(245,200,0,.22),transparent 35%),radial-gradient(circle at bottom right,rgba(255,255,255,.08),transparent 35%); pointer-events:none; }
.footer-inner { position:relative; z-index:1; max-width:1200px; margin:auto; display:grid; grid-template-columns:1.5fr 1fr 1.2fr 1fr; gap:15px; }
.footer-logo img { width:150px; margin-bottom:18px; }
.footer-tagline { color:var(--yellow); font-weight:800; font-size:1.1rem; margin-bottom:12px; }
.footer-desc { color:rgba(255,255,255,.82); line-height:1.8; max-width:330px; }
.site-footer h4 { color:var(--yellow); font-size:1.1rem; margin-bottom:18px; position:relative; }
.site-footer h4::after { content:""; width:45px; height:3px; background:var(--yellow); position:absolute; left:0; bottom:-8px; border-radius:10px; }
.site-footer ul { list-style:none; padding:0; margin:0; }
.site-footer ul li { margin-bottom:12px; color:rgba(255,255,255,.82); }
.site-footer a { color:rgba(255,255,255,.82); text-decoration:none; transition:.3s; }
.site-footer a:hover { color:var(--yellow); padding-left:5px; }
.social-icons { display:flex; gap:12px; margin-top:10px; }
.social-icons a { width:38px; height:38px; background:var(--yellow); color:var(--red-dark); display:inline-flex; align-items:center; justify-content:center; border-radius:50%; font-weight:800; transition:.3s; }
.social-icons a:hover { background:#fff; color:var(--red); padding-left:0; transform:translateY(-4px); }
.footer-hashtag { color:var(--yellow); font-weight:700; margin-top:18px; }
.footer-bottom { position:relative; z-index:1; margin-top:0px !important; padding:18px 0; border-top:1px solid rgba(255,255,255,.18); display:flex; justify-content:space-between; gap:15px; flex-wrap:wrap; color:rgba(255,255,255,.7); font-size:.9rem; }
.footer-bottom p { margin:0; }

@media(max-width:992px){ .footer-inner{grid-template-columns:1fr 1fr} }
@media(max-width:576px){ .site-footer{padding-top:50px} .footer-inner{grid-template-columns:1fr;text-align:center} .footer-desc{margin:auto} .site-footer h4::after{left:50%;transform:translateX(-50%)} .social-icons{justify-content:center} .footer-bottom{text-align:center;justify-content:center} }

@media(max-width:900px){
  .hero-grid { grid-template-columns:1fr; padding-top:calc(var(--nav-h) + 2rem); text-align:center; }
  .hero-visual { order:-1; min-height:300px; height:320px; }
  .hero-actions,.hero-badge { justify-content:center; margin:0 auto; }
  .footer-inner { grid-template-columns:1fr; gap:2rem; }
  .footer-bottom { flex-direction:column; gap:.5rem; text-align:center; }
}

@media(max-width:768px){
  .hamburger { display:flex; }
  .nav-links { position:fixed; top:0; right:-100%; width:75%; max-width:300px; height:100vh; flex-direction:column; align-items:flex-start; padding:90px 28px 2rem; background:var(--red-dark); backdrop-filter:blur(20px); border-left:1px solid rgba(245,200,0,.3); gap:0; transition:right .35s cubic-bezier(.4,0,.2,1); z-index:998; pointer-events:none; color:var(--yellow); }
  .nav-links.open { right:0; pointer-events:all; }
  .nav-link { display:block; padding:.9rem .5rem; font-size:.95rem; border-bottom:1px solid rgba(245,200,0,.15); width:100%; }
  .nav-link::after { display:none; }
  .nav-cta { display:none; }
}

/* ══ ABOUT TVK SECTION ══ */
.about-tvk-section .container { position:relative; z-index:2; }
.about-tvk-section { position:relative; background:#fff; padding:40px 0; overflow:hidden; }
.political-bg { position:absolute; inset:0; background-image:linear-gradient(rgba(220,38,38,.05),rgba(220,38,38,.05)),url("../../assets/img/hero.webp"); background-size:cover; background-position:center; opacity:.08; z-index:0; }
.section-badge { display:inline-block; background:#fff8df; color:var(--red); padding:8px 18px; border-radius:30px; font-weight:600; margin-bottom:15px; border:1px solid rgba(192,0,12,.15); }
.about-title { font-size:42px; font-weight:800; color:#111827; margin-bottom:25px; }
.about-title span { color:#dc2626; }
.about-text  { font-size:17px; line-height:1.9; color:#374151; margin-bottom:16px; }
.about-quote { margin-top:25px; color:var(--red); font-weight:700; font-size:22px;font-family:var(--font-display); }
.about-image-box { background:#fff; padding:18px; border-radius:20px; box-shadow:0 15px 40px rgba(0,0,0,.12); display:inline-block; }
.about-image-box img { border-radius:16px; max-height:520px; object-fit:contain; }

@media(max-width:768px){ .about-tvk-section{padding:60px 0} .about-title{font-size:32px} .about-text{font-size:16px} }

.section-title { position:relative; display:inline-block; font-size:42px; font-weight:800; color:var(--red); margin-bottom:30px; cursor:pointer;font-family:var(--font-display); }
.section-title span { color:var(--yellow-dark); }
.section-title::after { content:""; position:absolute; left:0; bottom:-10px; width:70px; height:4px; background:linear-gradient(90deg,var(--red),var(--yellow)); border-radius:20px; transition:all .4s; }
.section-title:hover::after { width:100%; }
.section-title:hover { color:var(--red-dark); }

/* ══ PROMISE / MANIFESTO — yellow bg ══ */
.promise-section {
  background:
    linear-gradient(135deg, #b0000b 0%, #8a0008 40%, #6a0006 100%),
    radial-gradient(ellipse 80% 60% at 20% 30%, rgba(245,200,0,.18) 0%, transparent 65%),
    radial-gradient(ellipse 60% 40% at 80% 70%, rgba(245,200,0,.12) 0%, transparent 55%);
}
.promise-section .section-title  { color:var(--red-dark); }
.promise-section .section-badge  { background:#fff8df; color:var(--red-dark); border-color:rgba(192,0,12,.25); }

.promise-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.promise-card { position:relative; min-height:360px; background:white; padding:60px 40px; border-right:1px solid rgba(192,0,12,.15); border-bottom:1px solid rgba(192,0,12,.15); overflow:hidden; transition:all .4s; }
.card-number  { position:absolute; top:-10px; right:28px; font-size:72px; font-weight:900; color:rgba(192,0,12,.10); line-height:1; transition:.4s; }
.card-icon    { font-size:38px; margin-bottom:35px; }
.card-icon img { width:42px; height:42px; filter:drop-shadow(0 0 8px rgba(192,0,12,.45)); transition:transform .3s; }
.promise-card h3 { color:var(--red-dark); font-size:26px; font-weight:900; text-transform:uppercase; letter-spacing:1px; margin-bottom:12px;font-family:var(--font-display); }
.promise-card h4 { color:var(--red); font-size:20px; font-weight:700; margin-bottom:22px; }
.promise-card p  { color:rgba(58,10,0,.70); font-size:16px; line-height:1.8; margin:0; }
.promise-card::after { content:""; position:absolute; left:0; bottom:0; width:0; height:4px; background:var(--red); transition:.4s; }
.promise-card:hover { background:#fff8df; transform:translateY(-6px); }
.promise-card:hover::after { width:100%; }
.promise-card:hover .card-number { color:rgba(192,0,12,.20); transform:scale(1.08); }
.promise-card:hover h3 { color:var(--red); }
@media(max-width:991px){ .promise-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:575px){ .promise-grid{grid-template-columns:1fr} .promise-card{min-height:auto;padding:45px 28px} .promise-card h3{font-size:22px} }

/* ══ DEFECTS SECTION ══ */
.defects-section { padding:28px 0; background:linear-gradient(135deg,#c0000c,#7a0008); font-family:var(--font-tamil); }
.defects-box { background:rgba(255,255,255,.92); border-radius:22px; padding:24px 28px; display:flex; align-items:center; justify-content:space-between; gap:25px; box-shadow:0 15px 35px rgba(0,0,0,.18); border-left:7px solid var(--yellow); position:relative; overflow:hidden; }
.defects-box::before { content:""; position:absolute; width:160px; height:160px; right:-60px; top:-60px; background:rgba(245,200,0,.12); border-radius:50%; }
.defects-badge { display:inline-block; background:var(--yellow); color:var(--red-dark); padding:5px 14px; border-radius:30px; font-size:14px; font-weight:700; margin-bottom:10px; }
.defects-content p { margin:0; color:#111; font-size:clamp(1rem,2.2vw,1.45rem); font-weight:800; line-height:1.6; }
.defects-btn { background:linear-gradient(135deg,var(--yellow),var(--yellow-dark)); color:var(--red-dark); padding:13px 28px; border-radius:40px; text-decoration:none; font-size:1rem; font-weight:800; white-space:nowrap; box-shadow:0 8px 20px rgba(245,200,0,.45); transition:all .3s; z-index:1; }
.defects-btn:hover { color:var(--red-dark); transform:translateY(-3px); box-shadow:0 12px 28px rgba(245,200,0,.55); }
@media(max-width:768px){ .defects-box{flex-direction:column;text-align:center;padding:22px 18px} .defects-btn{width:100%;text-align:center} }

/* ══ FEED SECTION ══ */
.political-feed-section { padding:70px 0; background:radial-gradient(circle at top left,rgba(192,0,12,.08),transparent 35%),linear-gradient(135deg,#fff7df,#fff); font-family:var(--font-tamil); }
.feed-heading            { text-align:center; margin-bottom:40px; }
.feed-heading span { color:var(--red); font-weight:900; }
.feed-heading h2  {font-family:var(--font-display); font-size:clamp(1.8rem,4vw,3rem); font-weight:900; color:#111; margin:8px 0; }
.feed-heading p   { color:#555; font-weight:600; }
.political-masonry { columns:4 260px; column-gap:22px; }
.political-post { position:relative; margin-bottom:22px; border-radius:24px; overflow:hidden; background:#fff; break-inside:avoid; box-shadow:0 18px 40px rgba(0,0,0,.16); border:4px solid #fff; transition:.35s; }
.political-post:hover { transform:translateY(-7px); box-shadow:0 28px 65px rgba(0,0,0,.25); }
.political-post img   { width:100%; height:auto; display:block; transition:.45s; max-height:470px; }
.political-post:hover img { transform:scale(1.04); }
.featured { background:#111; }
.featured img { min-height:320px; object-fit:cover; }
.post-info { position:absolute; inset:auto 0 0 0; padding:55px 20px 20px; color:#fff; background:linear-gradient(to top,rgba(0,0,0,.9),transparent); }
.post-info span,.post-tag { position:absolute; top:14px; left:14px; background:linear-gradient(135deg,var(--yellow),var(--yellow-dark)); color:#111; padding:6px 14px; border-radius:30px; font-size:12px; font-weight:900; z-index:3; }
.post-info h3  { font-size:1.25rem; font-weight:900; line-height:1.5; margin:0; }
.video::after  { content:""; position:absolute; inset:0; background:rgba(0,0,0,.28); }
.play-btn { position:absolute; inset:0; margin:auto; width:62px; height:62px; background:rgba(192,0,12,.92); color:#fff; border-radius:50%; display:grid; place-items:center; font-size:24px; z-index:4; box-shadow:0 12px 30px rgba(192,0,12,.5); }
.political-post::before { content:""; position:absolute; inset:0; border-radius:20px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.35); pointer-events:none; z-index:2; }
@media(max-width:768px){ .political-feed-section{padding:45px 0} .political-masonry{columns:2 160px;column-gap:14px} .political-post{margin-bottom:14px;border-radius:18px} }
@media(max-width:480px){ .political-masonry{columns:1} }

/* ══ SERVICE REQUEST FORM ══ */
.petition-page { min-height:100vh; display:grid; grid-template-columns:1fr 1fr; }

/* ★ Left panel = red brand bg */
.left-panel {

  position:relative;
  background:linear-gradient(135deg,#050505,#1b1b1b);
  color:#fff;
  padding:80px 45px 30px !important;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;

}
.left-panel::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 80% 50% at 20% 100%,rgba(245,200,0,.35) 0%,transparent 65%),radial-gradient(ellipse 60% 40% at 90% 5%,rgba(245,200,0,.15) 0%,transparent 60%); pointer-events:none; z-index:0; }
.left-panel::after  { content:'★'; position:absolute; bottom:-80px; right:-50px; font-size:420px; color:rgba(245,200,0,.07); line-height:1; pointer-events:none; z-index:0; }

.left-brand  { position:relative; z-index:1; padding:36px 40px 0; flex-shrink:0; }
.left-eyebrow { font-family:var(--font-body); font-size:10px; font-weight:700; letter-spacing:3.5px; text-transform:uppercase; color:var(--yellow); margin-bottom:10px; }
.left-title   { font-family:var(--font-display); font-size:clamp(42px,4.5vw,62px); line-height:.92; color:var(--white); letter-spacing:1px; }
.left-title span { color:var(--yellow); display:block; }
.left-divider { width:44px; height:3px; background:var(--yellow); margin:18px 0 14px; border-radius:2px; }
.left-subtitle { font-family:var(--font-tamil); font-size:13.5px; color:rgba(255,255,255,.65); line-height:1.75; max-width:300px; }

.left-image-wrap { position:relative; z-index:1; flex:1; min-height:0; overflow:hidden; }
.left-image-wrap img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:top center; opacity:.92; }
.left-image-wrap::before { content:''; position:absolute; inset:0; background:linear-gradient(to bottom,rgba(192,0,12,1) 0%,transparent 18%,transparent 72%,rgba(122,0,8,1) 100%); z-index:1; pointer-events:none; }
.left-image-wrap::after  { content:''; position:absolute; left:40px; top:20%; bottom:20%; width:3px; background:var(--yellow); border-radius:2px; z-index:2; pointer-events:none; }

.left-values { position:relative; z-index:1; flex-shrink:0; display:flex; flex-direction:column; gap:10px; padding:0 40px; }
.value-item  { display:flex; align-items:flex-start; gap:12px; }
.value-num   { font-family:var(--font-display); font-size:20px; color:var(--yellow); line-height:1; flex-shrink:0; width:24px; }
.value-text  { font-family:var(--font-tamil); font-size:12.5px; color:rgba(255,255,255,.65); line-height:1.45; padding-top:2px; }
.value-text strong { display:block; color:var(--white); font-size:13.5px; font-weight:600; margin-bottom:1px; }

.left-footer { position:relative; z-index:1; flex-shrink:0; padding:18px 40px 30px; margin-top:18px; border-top:1px solid rgba(255,255,255,.15); display:flex; align-items:center; justify-content:space-between; }
.left-footer-brand { display:flex; align-items:center; gap:10px; }
.logo-circle { width:34px; height:34px; border-radius:50%; background:var(--yellow); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-size:17px; color:var(--red-dark); font-weight:900; flex-shrink:0; }
.logo-text   { font-family:var(--font-display); font-size:15px; color:var(--white); letter-spacing:1px; line-height:1.2; }
.logo-text small { display:block; font-family:var(--font-body); font-size:9.5px; font-weight:600; letter-spacing:2px; color:var(--yellow); text-transform:uppercase; }
.left-footer-back { font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:rgba(255,255,255,.4); display:flex; align-items:center; gap:6px; transition:color .2s; text-decoration:none; }
.left-footer-back:hover { color:var(--yellow); }

.right-panel { background:#f4f1eb; overflow-y:auto; padding:52px 48px 60px; }
.form-top-label  { font-family:var(--font-body); font-size:11px; font-weight:700; letter-spacing:4px; text-transform:uppercase; color:var(--red); margin-bottom:8px; }
.form-main-title { font-family:var(--font-display); font-size:clamp(32px,3.5vw,46px); color:var(--black); line-height:1; letter-spacing:.5px; margin-bottom:6px; }
.form-main-title span { color:var(--red); }
.form-sub { font-family:var(--font-tamil); font-size:13.5px; color:rgba(15,0,2,.45); margin-bottom:36px; }

.steps-bar { display:flex; margin-bottom:36px; border-radius:8px; overflow:hidden; border:1px solid rgba(0,0,0,.1); }
.step { flex:1; display:flex; align-items:center; gap:8px; padding:10px 14px; font-size:12px; font-weight:600; letter-spacing:.3px; background:#fff; color:#bbb; border-right:1px solid rgba(0,0,0,.08); transition:background .2s,color .2s; }
.step:last-child { border-right:none; }
/* ★ Active step = red bg + yellow text */
.step.active { background:var(--red); color:var(--yellow); }
.step-num { width:20px; height:20px; border-radius:50%; background:rgba(255,255,255,.2); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; flex-shrink:0; }
.step:not(.active) .step-num { background:#eee; color:#999; }

.section-heading { display:flex; align-items:center; gap:10px; font-family:var(--font-body); font-size:10.5px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--red); margin-bottom:18px; }
.section-heading::after { content:''; flex:1; height:1px; background:rgba(15,0,2,.1); }

.row-2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.row-1 { margin-bottom:16px; }
.field { display:flex; flex-direction:column; gap:6px; }
.field label { font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:rgba(15,0,2,.55); }
.field label .req { color:var(--red); margin-left:2px; }
.field input,.field select,.field textarea { width:100%; padding:11px 14px; border:1.5px solid rgba(15,0,2,.12); border-radius:8px; font-family:var(--font-body); font-size:14.5px; color:var(--black); background:#fff; transition:border-color .2s,box-shadow .2s; outline:none; appearance:none; }
.field input:hover,.field select:hover { border-color:rgba(15,0,2,.25); }
.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--red); box-shadow:0 0 0 3px rgba(192,0,12,.1); }
.field input.error,.field select.error,.field textarea.error { border-color:var(--red); box-shadow:0 0 0 3px rgba(192,0,12,.1); }
.field .err-msg { font-size:11.5px; color:var(--red); display:none; font-weight:500; }
.field.has-error .err-msg { display:block; }
.field select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:36px; cursor:pointer; }
.field textarea { resize:vertical; min-height:100px; line-height:1.65; }
.char-count { text-align:right; font-size:11px; color:#aaa; font-weight:500; }
.divider { height:1px; background:rgba(15,0,2,.08); margin:10px 0 24px; }

.upload-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:8px; }
.upload-box  { aspect-ratio:1; border:1.5px dashed rgba(15,0,2,.18); border-radius:10px; display:flex; flex-direction:column; align-items:center; justify-content:center; cursor:pointer; position:relative; overflow:hidden; background:#fff; transition:border-color .2s,background .2s; }
.upload-box:hover { border-color:var(--red); background:#fff5f5; }
.upload-box input[type="file"] { position:absolute; inset:0; opacity:0; cursor:pointer; font-size:0; width:100%; height:100%; border:none; padding:0; }
.upload-icon  { font-size:22px; color:#ccc; margin-bottom:4px; pointer-events:none; }
.upload-label { font-size:9.5px; font-weight:700; color:#ccc; letter-spacing:1px; text-transform:uppercase; pointer-events:none; }
.upload-box.filled { border-style:solid; border-color:var(--red); }
.upload-box .preview-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:9px; }
.upload-box .remove-btn  { position:absolute; top:5px; right:5px; z-index:3; width:20px; height:20px; background:var(--red); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:10px; color:#fff; font-weight:700; cursor:pointer; border:none; line-height:1; }
.upload-hint { font-size:11.5px; color:#aaa; margin-bottom:28px; font-weight:500; }

.submit-row    { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:8px; }
.required-note { font-size:12px; color:#aaa; font-family:var(--font-tamil); }
.btn-submit    { background:var(--red); color:var(--yellow); border:none; border-radius:50px; padding:14px 42px; font-family:var(--font-display); font-size:18px; letter-spacing:1.5px; cursor:pointer; display:flex; align-items:center; gap:10px; transition:background .2s,transform .1s,box-shadow .2s; box-shadow:0 4px 20px rgba(192,0,12,.3); }
.btn-submit:hover  { background:var(--red-dark); box-shadow:0 6px 28px rgba(192,0,12,.4); }
.btn-submit:active { transform:scale(.98); }
.btn-submit:disabled { opacity:.6; cursor:not-allowed; transform:none; }

.spinner { width:16px; height:16px; border:2px solid rgba(245,200,0,.3); border-top-color:var(--yellow); border-radius:50%; animation:spin .7s linear infinite; display:none; }
@keyframes spin { to{transform:rotate(360deg)} }

.toast { display:none; margin-top:20px; padding:16px 18px; border-radius:10px; background:#eaf8f1; border:1px solid #b6e8d0; align-items:flex-start; gap:12px; }
.toast.show { display:flex; }
.toast.error-toast { background:#fff0f0; border-color:rgba(192,0,12,.2); }
.toast-icon { font-size:20px; color:#1a6644; flex-shrink:0; }
.toast.error-toast .toast-icon { color:var(--red); }
.toast-body { flex:1; }
.toast-title { font-weight:700; font-size:14px; color:#1a6644; margin-bottom:3px; }
.toast.error-toast .toast-title { color:var(--red-dark); }
.toast-msg { font-size:13px; color:#2a6644; }
.toast.error-toast .toast-msg { color:var(--red); }

@media(max-width:960px){
  .petition-page { grid-template-columns:1fr; }
  .left-panel    { position:relative; height:auto; min-height:unset; }
  .left-brand    { padding:32px 28px 0; }
  .left-image-wrap { height:260px; flex:none; margin-top:20px; }
  .left-values   { padding:0 28px; }
  .left-footer   { padding:16px 28px 28px; }
  .right-panel   { padding:36px 24px 50px; }
  .row-2         { grid-template-columns:1fr; }
  .upload-grid   { grid-template-columns:repeat(3,1fr); }
  .submit-row    { flex-direction:column; align-items:stretch; }
  .btn-submit    { justify-content:center; }
}
@media(max-width:480px){ .steps-bar{flex-direction:column;border-radius:10px} .step{border-right:none;border-bottom:1px solid rgba(0,0,0,.08)} .step:last-child{border-bottom:none} }

/* ══ GALLERY ══ */
.gallery-section { background:#fff; padding:110px 20px 70px; }
.gallery-header  { text-align:center; margin:0 auto 45px; }
.gallery-header span { display:inline-block; color:var(--red); font-weight:800; letter-spacing:2px; text-transform:uppercase; font-size:13px; margin-bottom:10px; }
.gallery-header h4   { font-size:clamp(42px,6vw,76px); font-weight:900; color:var(--red); line-height:1; margin-bottom:12px; }
.gallery-header h4 b { color:var(--yellow); }
.gallery-header p    { font-family:'Noto Sans Tamil',sans-serif; color:#666; font-size:16px; }
.gallery-grid  { max-width:1250px; margin:0 auto; columns:4 260px; column-gap:18px; }
.gallery-card  { break-inside:avoid; margin-bottom:18px; border-radius:18px; overflow:hidden; background:#fff; box-shadow:0 14px 35px rgba(0,0,0,.12); border:1px solid rgba(192,0,12,.08); position:relative; }
.gallery-card img  { width:100%; display:block; transition:.45s; }
.gallery-card::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(192,0,12,.35),rgba(245,200,0,.15),transparent); opacity:0; transition:.35s; }
.gallery-card:hover img   { transform:scale(1.08); }
.gallery-card:hover::after { opacity:1; }
@media(max-width:768px){ .gallery-section{padding-top:90px} .gallery-grid{columns:2 180px;column-gap:12px} .gallery-card{margin-bottom:12px;border-radius:14px} }
@media(max-width:480px){ .gallery-grid{columns:1} }

/* ══ CONTACT HERO — red bg + yellow accents ══ */
.contact-hero {
  position:relative; padding-top:calc(var(--nav-h) + 4rem); padding-bottom:3rem; overflow:hidden;
  background:
    radial-gradient(ellipse 70% 60% at 10% 50%, rgba(245,200,0,.25) 0%, transparent 65%),
    radial-gradient(ellipse 50% 70% at 90% 20%,  rgba(245,200,0,.12) 0%, transparent 55%),
    linear-gradient(160deg, #c0000c 0%, #a00008 50%, #7a0008 100%);
}
.contact-hero::after { content:''; position:absolute; bottom:-2px; left:0; width:100%; height:80px; background:var(--red-dark); clip-path:polygon(0 100%,100% 0,100% 100%); }
.hero-grid-lines { position:absolute; inset:0; pointer-events:none; opacity:.06; background-image:linear-gradient(rgba(245,200,0,.8) 1px,transparent 1px),linear-gradient(90deg,rgba(245,200,0,.8) 1px,transparent 1px); background-size:60px 60px; }
.contact-hero-inner { max-width:1200px; margin:0 auto; padding:0 2rem; position:relative; z-index:1; display:flex; flex-direction:column; gap:1rem; }
.ch-eyebrow { display:inline-flex; align-items:center; gap:.6rem; font-size:.68rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--yellow); }
.ch-eyebrow::before { content:''; width:28px; height:2px; background:var(--yellow); }
.ch-title { font-family:var(--font-display); font-size:clamp(3.5rem,9vw,7.5rem); line-height:.92; letter-spacing:.02em; text-transform:uppercase; color:var(--white); }
.ch-title .accent  { color:var(--yellow); }
.ch-title .outline { -webkit-text-stroke:2px var(--yellow); color:transparent; }
.ch-sub { font-family:var(--font-tamil); font-size:1rem; color:rgba(255,255,255,.6); line-height:1.7; max-width:480px; }

/* ══ CONTACT MAIN — deep red ══ */
.contact-main { background:linear-gradient(135deg,#7a0008,#a00010); padding:4rem 2rem 6rem; }
.contact-grid { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:1fr 1.55fr; gap:4rem; align-items:start; }
.contact-info { display:flex; flex-direction:column; gap:2rem; }

.info-block-label { font-size:.65rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--yellow); margin-bottom:1.25rem; display:flex; align-items:center; gap:.6rem; }
.info-block-label::after { content:''; flex:1; height:1px; background:rgba(245,200,0,.25); }

.quote-card { position:relative; background:linear-gradient(135deg,rgba(245,200,0,.18),rgba(192,0,12,.12)); border:1px solid rgba(245,200,0,.3); border-radius:16px; padding:2rem 2rem 2rem 3rem; overflow:hidden;font-family:var(--font-display); }
.quote-card::before { content:'"'; position:absolute; top:-.3rem; left:1rem; font-family:var(--font-display); font-size:8rem; color:rgba(245,200,0,.15); line-height:1; pointer-events:none; }
.quote-card blockquote { font-family:var(--font-tamil); font-size:1.05rem; line-height:1.8; color:rgba(255,255,255,.85); font-style:italic; position:relative; z-index:1; }
.quote-card cite { display:block; margin-top:.75rem; font-family:var(--font-body); font-style:normal; font-size:.75rem; font-weight:700; letter-spacing:.12em; color:var(--yellow); text-transform:uppercase; }

.contact-cards { display:flex; flex-direction:column; gap:1px; }
.cc { display:flex; align-items:flex-start; gap:1.1rem; padding:1.15rem 1.25rem; background:rgba(255,255,255,.06); border:1px solid rgba(245,200,0,.12); border-radius:12px; margin-bottom:10px; transition:background .2s,border-color .2s,transform .2s; cursor:default; }
.cc:hover { background:rgba(245,200,0,.12); border-color:rgba(245,200,0,.35); transform:translateX(4px); }
.cc-icon { width:44px; height:44px; flex-shrink:0; background:rgba(245,200,0,.12); border:1px solid rgba(245,200,0,.25); border-radius:10px; display:flex; align-items:center; justify-content:center; }
.cc-icon svg { width:20px; height:20px; color:var(--yellow); }
.cc-label { font-size:.63rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-bottom:3px; }
.cc-value { font-size:.92rem; color:var(--white); font-weight:600; line-height:1.5; }
.cc-value a { color:var(--white); transition:color .2s; }
.cc-value a:hover { color:var(--yellow); }

.social-row { display:flex; gap:.75rem; flex-wrap:wrap; }
.social-btn { display:inline-flex; align-items:center; gap:.5rem; padding:.6rem 1.1rem; border-radius:8px; font-size:.75rem; font-weight:700; letter-spacing:.08em; border:1px solid rgba(245,200,0,.2); background:rgba(245,200,0,.06); color:rgba(255,255,255,.65); transition:all .2s; }
.social-btn svg { width:16px; height:16px; flex-shrink:0; }
.social-btn:hover { background:rgba(245,200,0,.15); border-color:rgba(245,200,0,.5); color:var(--yellow); }

.contact-form-wrap { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:20px; padding:2.5rem 2.5rem 2.75rem; position:relative; overflow:hidden; }
.contact-form-wrap::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--yellow),var(--red-light),var(--yellow)); }
.form-eyebrow { font-size:.65rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--yellow); margin-bottom:.4rem; }
.form-title   { font-family:var(--font-display); font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--white); letter-spacing:.04em; line-height:1; margin-bottom:.5rem; }
.form-title span { color:var(--yellow); }
.form-desc { font-family:var(--font-tamil); font-size:.85rem; color:rgba(255,255,255,.5); line-height:1.7; margin-bottom:2rem; }

.type-tabs { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1.75rem; }
.type-tab  { padding:.45rem 1rem; border-radius:6px; cursor:pointer; font-size:.72rem; font-weight:700; letter-spacing:.1em; border:1.5px solid rgba(245,200,0,.2); background:transparent; color:rgba(255,255,255,.5); transition:all .2s; }
.type-tab.active,.type-tab:hover { background:var(--yellow); border-color:var(--yellow); color:var(--red-dark); }

.cf-row2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1rem; }
.cf-row1 { margin-bottom:1rem; }
.cf-field { display:flex; flex-direction:column; gap:.4rem; }
.cf-field label { font-size:.63rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:rgba(255,255,255,.45); }
.cf-field label .req { color:var(--yellow); margin-left:2px; }
.cf-field input,.cf-field select,.cf-field textarea { width:100%; padding:11px 14px; background:rgba(255,255,255,.07); border:1.5px solid rgba(255,255,255,.12); border-radius:10px; font-family:var(--font-body); font-size:14px; color:var(--white); outline:none; transition:border-color .2s,box-shadow .2s,background .2s; appearance:none; }
.cf-field input::placeholder,.cf-field textarea::placeholder { color:rgba(255,255,255,.25); }
.cf-field select { color:rgba(255,255,255,.75); cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:36px; }
.cf-field select option { background:#7a0008; color:var(--white); }
.cf-field input:focus,.cf-field select:focus,.cf-field textarea:focus { border-color:var(--yellow); background:rgba(245,200,0,.08); box-shadow:0 0 0 3px rgba(245,200,0,.12); }
.cf-field textarea { resize:vertical; min-height:110px; line-height:1.65; }
.cf-err { font-size:.7rem; color:var(--yellow); display:none; font-weight:500; }
.cf-field.has-error input,.cf-field.has-error select,.cf-field.has-error textarea { border-color:var(--yellow); box-shadow:0 0 0 3px rgba(245,200,0,.18); }
.cf-field.has-error .cf-err { display:block; }

.consent-row { display:flex; align-items:flex-start; gap:.65rem; margin-bottom:1.75rem; padding:1rem; background:rgba(245,200,0,.06)!important; border:1px solid rgba(245,200,0,.15); border-radius:10px; }
.consent-row input[type="checkbox"] { width:18px; height:18px; flex-shrink:0; margin-top:1px; accent-color:var(--yellow); cursor:pointer; }
.consent-row label { font-family:var(--font-tamil); font-size:.8rem; color:rgba(255,255,255,.55); line-height:1.6; cursor:pointer; }
.consent-row label a { color:var(--yellow); }

.cf-submit-row { display:flex; align-items:center; gap:1rem; }
.cf-btn { display:inline-flex; align-items:center; gap:.65rem; background:var(--yellow); color:var(--red-dark); border:none; border-radius:8px; padding:.9rem 2.4rem; font-family:var(--font-display); font-size:1.2rem; letter-spacing:.06em; cursor:pointer; transition:background .2s,transform .15s,box-shadow .2s; box-shadow:0 4px 24px rgba(245,200,0,.35); }
.cf-btn:hover  { background:var(--yellow-light); transform:translateY(-2px); box-shadow:0 8px 32px rgba(245,200,0,.5); }
.cf-btn:active { transform:scale(.98); }
.cf-btn:disabled { opacity:.55; cursor:not-allowed; transform:none; }
.cf-btn svg { width:20px; height:20px; }
.cf-note { font-size:.72rem; color:rgba(255,255,255,.3); font-weight:500; font-family:var(--font-tamil); line-height:1.6; }

.cf-toast { display:none; margin-top:1.25rem; padding:1rem 1.25rem; border-radius:10px; flex-direction:column; gap:.3rem; }
.cf-toast.show    { display:flex; }
.cf-toast.success { background:rgba(0,180,80,.1);    border:1px solid rgba(0,180,80,.25); }
.cf-toast.error   { background:rgba(245,200,0,.1);   border:1px solid rgba(245,200,0,.3); }
.cf-toast-title   { font-size:.85rem; font-weight:700; color:var(--white); }
.cf-toast-msg     { font-family:var(--font-tamil); font-size:.78rem; color:rgba(255,255,255,.55); }

/* ══ OFFICES BAND — yellow bg ══ */
.offices-band    { background:var(--yellow); border-top:1px solid rgba(192,0,12,.2); border-bottom:1px solid rgba(192,0,12,.2); padding:3.5rem 2rem; }
.offices-inner   { max-width:1200px; margin:0 auto; }
.offices-header  { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:1rem; margin-bottom:2rem; }
.offices-title   { font-family:var(--font-display); font-size:clamp(1.8rem,4vw,3rem); color:var(--red-dark); letter-spacing:.05em; }
.offices-title span { color:var(--red); }
.offices-sub     { font-family:var(--font-tamil); font-size:.82rem; color:rgba(58,0,8,.55); }
.offices-grid    { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:1px; border:1px solid rgba(192,0,12,.15); border-radius:12px; overflow:hidden; }
.office-card     { padding:1.25rem 1.4rem; background:rgba(255,255,255,.55); border-right:1px solid rgba(192,0,12,.1); border-bottom:1px solid rgba(192,0,12,.1); transition:background .2s; }
.office-card:hover { background:rgba(192,0,12,.1); }
.office-district { font-family:var(--font-body); font-weight:700; font-size:.88rem; color:var(--red-dark); margin-bottom:4px; }
.office-num      { font-size:.75rem; color:var(--red); font-weight:600; }
.office-addr     { font-family:var(--font-tamil); font-size:.72rem; color:rgba(58,0,8,.55); margin-top:4px; line-height:1.5; }

/* ══ EMERGENCY STRIP ══ */
.emergency-strip { background:var(--red); border-top:2px solid var(--yellow); padding:1.75rem 2rem; }
.emergency-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.25rem; }
.emerg-left { display:flex; align-items:center; gap:1rem; }
.emerg-icon { width:48px; height:48px; border-radius:50%; background:rgba(245,200,0,.2); border:2px solid var(--yellow); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.emerg-icon svg { width:22px; height:22px; color:var(--yellow); }
.emerg-label { font-size:.65rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.65); margin-bottom:2px; }
.emerg-text  { font-family:var(--font-display); font-size:1.4rem; color:var(--white); letter-spacing:.05em; }
.emerg-btn   { display:inline-flex; align-items:center; gap:.5rem; background:var(--yellow); color:var(--red-dark); padding:.75rem 1.75rem; border-radius:6px; font-family:var(--font-display); font-size:1.1rem; letter-spacing:.06em; transition:background .2s,transform .2s,box-shadow .2s; }
.emerg-btn:hover { background:var(--yellow-light); transform:translateY(-2px); box-shadow:0 6px 20px rgba(245,200,0,.45); }
.emerg-btn svg { width:18px; height:18px; }

/* ══ ABOUT PAGE ══ */
.about-hero { padding:calc(var(--nav-h) + 4rem) 2rem 5rem; background:radial-gradient(circle at 10% 20%,rgba(245,200,0,.30),transparent 30%),radial-gradient(circle at 90% 10%,rgba(192,0,12,.12),transparent 35%),linear-gradient(135deg,#fff 0%,#fff8df 100%); position:relative; overflow:hidden; }
.about-hero::after { content:''; position:absolute; right:-120px; bottom:-120px; width:340px; height:340px; background:rgba(245,200,0,.15); border-radius:50%; }
.hero-inner { max-width:1200px; margin:auto; display:grid; grid-template-columns:1.1fr .9fr; gap:3rem; align-items:center; position:relative; z-index:1; }
.eyebrow    { color:var(--red); font-size:.72rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase; margin-bottom:1rem; }
.hero-title { font-family:var(--font-display); font-size:clamp(3.8rem,8vw,7rem); line-height:.9; color:var(--black); letter-spacing:.02em; }
.hero-title span { color:var(--red); }
.hero-tamil { font-family:var(--font-tamil); font-size:1.1rem; line-height:1.8; color:#555; max-width:620px; margin:1.3rem 0; }
.hero-buttons { display:flex; flex-wrap:wrap; gap:1rem; margin-top:1.5rem; }
.btn-red { background:var(--red); color:#fff; padding:.9rem 1.8rem; border-radius:8px; font-weight:800; letter-spacing:.08em; }
.leader-card { background:#fff; border-radius:24px; padding:1rem; box-shadow:0 25px 70px rgba(0,0,0,.15); border:1px solid rgba(192,0,12,.12); }
.leader-photo { height:460px; border-radius:18px; overflow:hidden; position:relative; }
.leader-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.leader-photo::after { content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.35),rgba(0,0,0,.05)); }
.leader-name    { padding:1.2rem .8rem .4rem; text-align:center; }
.leader-name h3 { font-family:var(--font-tamil); font-weight:900; color:var(--red-dark); margin-bottom:.25rem; }
.leader-name p  { color:#777; font-weight:700; margin:0; }

.section       { padding:5rem 2rem; }
.section-inner { max-width:1200px; margin:auto; }
.section-head  { max-width:720px; margin-bottom:2.5rem; }
.section-kicker { color:var(--red); font-size:.7rem; font-weight:900; letter-spacing:.22em; text-transform:uppercase; margin-bottom:.7rem; }
.section-desc   { font-family:var(--font-tamil); color:#666; line-height:1.8; margin-top:.8rem; }

.bio-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:3rem; align-items:start; }

/* ★ About page quote card = yellow bg */
.bio-grid .quote-card { background:var(--yellow); color:var(--red-dark); border-radius:22px; padding:2.3rem; position:sticky; top:100px; box-shadow:0 20px 50px rgba(245,200,0,.35); border:none; }
.bio-grid .quote-card::before { color:rgba(192,0,12,.15); }
.bio-grid .quote-card h3 { font-family:var(--font-display); font-size:1.35rem; line-height:1.8; font-weight:800; color:var(--red-dark); }
.bio-grid .quote-card p  { color:rgba(122,0,8,.72); margin-top:1rem; margin-bottom:0; }

.bio-content p { font-family:var(--font-tamil); color:#555; line-height:1.9; font-size:.98rem; margin-bottom:1.2rem; }
.info-list     { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; margin-top:1.5rem; }
.info-box { background:#fff; border:1px solid #eee; border-left:5px solid var(--yellow); padding:1.2rem; border-radius:14px; box-shadow:0 10px 30px rgba(0,0,0,.05); }
.info-box small  { display:block; color:#888; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.25rem; }
.info-box strong { color:var(--black); font-size:1.05rem; }

.vision-section { background:#fafafa; }
.vision-grid    { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.vision-card    { background:#fff; border-radius:20px; padding:2rem; border:1px solid #eee; box-shadow:0 16px 35px rgba(0,0,0,.05); transition:.25s; }
.vision-card:hover { transform:translateY(-8px); border-color:rgba(245,200,0,.5); }
.vision-icon { width:54px; height:54px; border-radius:16px; background:#fff8df; color:var(--red); display:flex; align-items:center; justify-content:center; font-size:1.7rem; margin-bottom:1rem; }
.vision-card h3 { font-family:var(--font-tamil); font-weight:900; color:var(--red-dark); margin-bottom:.7rem; }
.vision-card p  { font-family:var(--font-tamil); color:#666; line-height:1.8; margin:0; }

.stats-row { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:2rem; }
.stat-card { background:linear-gradient(135deg,#fff8df,#fff); border:1px solid rgba(245,200,0,.45); border-radius:18px; padding:1.8rem; text-align:center; }
.stat-card h3 { font-family:var(--font-display); font-size:3rem; color:var(--red); margin:0; }
.stat-card p  { font-family:var(--font-tamil); color:#555; font-weight:700; margin:0; }

.timeline { border-left:3px solid var(--yellow); padding-left:2rem; margin-top:2rem; }
.timeline-item { position:relative; margin-bottom:2rem; background:#fff; padding:1.5rem; border-radius:16px; border:1px solid #eee; box-shadow:0 12px 30px rgba(0,0,0,.05); }
.timeline-item::before { content:''; position:absolute; left:-2.65rem; top:1.5rem; width:18px; height:18px; background:var(--yellow); border:4px solid var(--red); border-radius:50%; }
.timeline-item h4 { color:var(--red-dark); font-weight:900; }
.timeline-item p  { font-family:var(--font-tamil); color:#666; line-height:1.8; margin:0; }

/* ★ CTA section = yellow bg */
.cta-section   { background:linear-gradient(135deg,var(--yellow),var(--yellow-dark)); color:var(--red-dark); text-align:center; padding:4rem 2rem; }
.cta-section h2 { font-family:var(--font-display); font-size:clamp(2.5rem,5vw,4.5rem); margin-bottom:.7rem; }
.cta-section p  { font-family:var(--font-tamil); color:rgba(122,0,8,.75); max-width:720px; margin:auto auto 1.6rem; line-height:1.8; }
.cta-section a  { background:var(--red); color:var(--yellow); padding:.95rem 2rem; border-radius:8px; font-weight:900; display:inline-block; }
.cta-section a:hover { background:var(--red-dark); }

@media(max-width:991px){ .hero-inner,.bio-grid{grid-template-columns:1fr} .vision-grid,.stats-row{grid-template-columns:repeat(2,1fr)} .leader-photo{height:380px} }