/* ============================================================
   IPA INDIA — DESIGN TOKENS  (Lively / Colourful "Shade Card")
   Signature concept stays the same — India's paint industry is,
   at its core, an industry of colour — but instead of a dark
   corporate shell, the whole site is built as a bright shade
   card: a warm paper base with a full rainbow of swatch hues,
   and soft paint-drip "watermark" blobs used everywhere as the
   decorative language instead of grey or near-black panels.
   ============================================================ */
:root{
  --ink:#FEFBF4;          /* text colour only — never used as a background (brightened) */
  --ink-soft:#E7E0F2;     /* secondary text — brighter, higher-contrast lavender */
  --line: rgba(245,239,225,0.20);   /* warm tinted hairline, not neutral grey */

  --paper:#241640;        /* deep violet — default background (colourful dark, not black/grey) */
  --paper-alt:#2E1B4A;    /* alt violet, still distinct from section jewel-tones below */
  --paper-card:#3D2E5C;   /* lighter elevated-card violet, reads clearly on every jewel bg below */

  --coral:#FF5A36;    --coral-dark:#FF8A66;
  --teal:#0EA394;     --teal-dark:#4BE0CE;
  --yellow:#FFC93C;   --yellow-dark:#FFDD85;
  --violet:#8B5CF6;   --violet-dark:#BBA3FF;
  --pink:#F0508B;     --pink-dark:#FF97BC;
  --green:#3FA66E;    --green-dark:#7EDBA6;
  --blue:#2F80ED;     --blue-dark:#86B8FF;
  --plum:#B4459F;     --plum-dark:#E599D6;

  --signal: var(--coral);
  --signal-dark: var(--coral-dark);
  --petrol: var(--teal);
  --pigment: var(--yellow);

  --display: 'Space Grotesk', sans-serif;
  --editorial: 'Fraunces', serif;
  --body: 'Inter', sans-serif;
  --mono: 'IBM Plex Mono', monospace;

  --container: 1240px;
  --edge: 20px;
  --radius: 10px;
}
@media(min-width:900px){ :root{ --edge:48px; } }

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:92px; }
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--body); font-size:18px; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; }
h1,h2,h3,h4{ font-family:var(--display); margin:0; letter-spacing:-0.01em; }
p{ margin:0; }
button{ font-family:inherit; cursor:pointer; }
.container{ max-width:var(--container); margin:0 auto; padding:0 var(--edge); position:relative; }
.eyebrow{
  font-family:var(--mono); font-size:13px; letter-spacing:0.16em; text-transform:uppercase;
  display:flex; align-items:center; gap:10px; color:var(--coral-dark); margin-bottom:16px; font-weight:600;
}
.eyebrow::before{ content:""; width:20px; height:3px; background:var(--coral); display:block; border-radius:2px; }
.eyebrow--plain::before{ display:none; }
.section{ padding:48px 0; position:relative; overflow:hidden; }
@media(min-width:900px){ .section{ padding:68px 0; } }
.section-head{ max-width:760px; margin-bottom:28px; position:relative; z-index:2; }
.section-head h2{ font-size:clamp(28px,4vw,42px); line-height:1.1; color:#FFFFFF; letter-spacing:-0.022em; font-weight:700; }
.section-head .sub{ margin-top:18px; font-size:20px; color:var(--ink-soft); line-height:1.55; }
.btn{
  display:inline-flex; align-items:center; gap:10px; padding:15px 28px;
  font-family:var(--display); font-weight:600; font-size:15.5px; letter-spacing:0.01em;
  border-radius:999px; border:1px solid transparent; text-decoration:none;
  transition:transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{ background:var(--coral); color:#fff; box-shadow:0 10px 24px -10px rgba(255,90,54,0.55); }
.btn-primary:hover{ background:var(--coral-dark); }
.btn-ghost-dark{ border-color:rgba(255,255,255,0.55); color:#fff; }
.btn-ghost-dark:hover{ border-color:#fff; background:rgba(255,255,255,0.14); }
.btn-ghost-light{ border-color:rgba(34,26,46,0.2); color:var(--ink); }
.btn-ghost-light:hover{ border-color:var(--ink); background:rgba(34,26,46,0.05); }
@media(prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* ---------- reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }

/* section headings: staggered text-in */
@keyframes rise-in{ from{ opacity:0; transform:translateY(22px); filter:blur(6px); } to{ opacity:1; transform:none; filter:blur(0); } }
@keyframes wipe-in{ from{ width:0; } to{ width:20px; } }

.section-head.reveal .eyebrow,
.section-head.reveal h2,
.section-head.reveal .sub{ opacity:0; }
.section-head.reveal .eyebrow::before{ width:0; }
.section-head.reveal.in .eyebrow{ animation:rise-in .6s ease .05s forwards; }
.section-head.reveal.in .eyebrow::before{ animation:wipe-in .5s ease .5s forwards; }
.section-head.reveal.in h2{ animation:rise-in .7s cubic-bezier(.2,.7,.2,1) .16s forwards; }
.section-head.reveal.in .sub{ animation:rise-in .6s ease .3s forwards; }

/* staggered children for card grids (add class "stg" beside "reveal") */
.stg.reveal > *{ opacity:0; }
.stg.reveal.in > *{ animation:rise-in .55s ease forwards; }
.stg.reveal.in > *:nth-child(1){ animation-delay:.04s; }
.stg.reveal.in > *:nth-child(2){ animation-delay:.11s; }
.stg.reveal.in > *:nth-child(3){ animation-delay:.18s; }
.stg.reveal.in > *:nth-child(4){ animation-delay:.25s; }
.stg.reveal.in > *:nth-child(5){ animation-delay:.32s; }
.stg.reveal.in > *:nth-child(6){ animation-delay:.39s; }
.stg.reveal.in > *:nth-child(7){ animation-delay:.46s; }
.stg.reveal.in > *:nth-child(8){ animation-delay:.53s; }
.stg.reveal.in > *:nth-child(n+9){ animation-delay:.6s; }

@media(prefers-reduced-motion:reduce){
  .section-head.reveal .eyebrow,
  .section-head.reveal h2,
  .section-head.reveal .sub,
  .stg.reveal > *{ opacity:1 !important; animation:none !important; }
  .section-head.reveal .eyebrow::before{ width:20px; }
}

/* ---------- scroll to top ---------- */
.to-top{
  position:fixed; right:22px; bottom:22px; z-index:95;
  width:50px; height:50px; border-radius:50%; border:0; cursor:pointer;
  background:var(--coral); color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 14px 30px -8px rgba(0,0,0,0.55);
  opacity:0; transform:translateY(14px) scale(0.9); pointer-events:none;
  transition:opacity .25s ease, transform .25s ease, background .2s ease;
}
.to-top.show{ opacity:1; transform:none; pointer-events:auto; }
.to-top:hover{ background:var(--coral-dark); transform:translateY(-2px); }
.to-top svg{ width:22px; height:22px; }
@media(min-width:900px){ .to-top{ right:32px; bottom:32px; width:54px; height:54px; } }

/* ---------- skip link ---------- */
.skip-link{
  position:absolute; left:-999px; top:auto; background:#221A2E; color:#fff;
  padding:12px 18px; z-index:200; font-family:var(--display); font-size:14px; border-radius:8px;
}
.skip-link:focus{ left:16px; top:16px; }
:focus-visible{ outline:2px solid var(--coral); outline-offset:3px; }

/* ============================================================
   WATERMARK BLOBS — reusable decorative "paint drip" shapes
   used across every section for a consistent, lively texture.
   Always aria-hidden, always pointer-events:none, always sits
   behind content (z-index:0 in a positioned section).
   ============================================================ */
.watermark{ position:absolute; z-index:0; pointer-events:none; filter:blur(0px); }
.watermark svg{ width:100%; height:100%; display:block; }

/* ============================================================
   HEADER / MEGA MENU — light, colourful, single line
   ============================================================ */
header{
  position:sticky; top:0; z-index:100; background:rgba(30,16,48,0.94); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.nav-row{ display:flex; align-items:center; justify-content:space-between; height:80px; gap:16px; }
.logo{ display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink); flex:none; position:relative; }
.logo .mark-badge{ position:relative; display:flex; align-items:center; justify-content:center; flex:none; width:46px; height:46px; background:#F5EFE1; border-radius:12px; box-shadow:0 10px 22px -10px rgba(0,0,0,0.55); }
.logo .mark-badge .blob{ position:absolute; inset:-6px; z-index:0; opacity:0.9; }
.logo .mark-badge img{ position:relative; z-index:1; height:23px; width:auto; display:block; }
.logo-text{ font-family:var(--display); font-weight:700; font-size:17px; letter-spacing:0.01em; line-height:1.15; white-space:nowrap; }
.logo-text span{ display:block; font-family:var(--mono); font-size:9.5px; letter-spacing:0.14em; color:var(--ink-soft); font-weight:400; margin-top:2px; }

nav.primary{ display:none; }
@media(min-width:1080px){
  nav.primary{ display:flex; align-items:center; gap:4px; flex:1; justify-content:flex-end; min-width:0; }

  .nav-item{
    position:relative; flex:none; display:flex; align-items:center;
    border-radius:999px; transition:background .2s;
  }
  .nav-item:hover, .nav-item.open, .nav-item:focus-within{ background:rgba(255,90,54,0.18); }

  .nav-item > .nav-link{
    display:flex; align-items:center; background:none; border:0;
    color:var(--ink); text-decoration:none; font-family:var(--body); font-size:15.5px; font-weight:600;
    padding:11px 14px; border-radius:999px; opacity:0.92; transition:opacity .2s, color .2s;
    white-space:nowrap; line-height:1;
  }
  .nav-item.has-children > .nav-link{ padding-right:4px; }
  .nav-item:hover > .nav-link, .nav-item.open > .nav-link, .nav-item:focus-within > .nav-link{ opacity:1; color:var(--coral-dark); }

  .nav-toggle{
    display:flex; align-items:center; justify-content:center; background:none; border:0; cursor:pointer;
    padding:11px 13px 11px 5px; color:var(--ink); opacity:0.92; border-radius:999px;
  }
  .nav-item:hover .nav-toggle, .nav-item.open .nav-toggle, .nav-item:focus-within .nav-toggle{ opacity:1; color:var(--coral-dark); }
  .nav-caret{ width:10px; height:10px; flex:none; transition:transform .2s ease; }
  .nav-item:hover .nav-caret, .nav-item.open .nav-caret, .nav-item:focus-within .nav-caret{ transform:rotate(180deg); }

  /* Membership — highlighted, most-visible item */
  .nav-item.highlight{ background:var(--coral); box-shadow:0 8px 20px -10px rgba(255,90,54,0.7); }
  .nav-item.highlight:hover, .nav-item.highlight.open, .nav-item.highlight:focus-within{ background:var(--coral-dark); }
  .nav-item.highlight > .nav-link, .nav-item.highlight .nav-toggle{ color:#fff; opacity:1; font-weight:700; }
  .nav-item.highlight:hover > .nav-link, .nav-item.highlight.open > .nav-link,
  .nav-item.highlight:hover .nav-toggle, .nav-item.highlight.open .nav-toggle{ color:#fff; }

  .submenu{
    position:absolute; top:calc(100% + 12px); left:50%; transform:translateX(-50%) translateY(6px);
    min-width:250px; max-height:min(70vh, 460px); overflow-y:auto; overscroll-behavior:contain;
    background:var(--paper-card); border:1px solid var(--line);
    box-shadow:0 30px 60px -20px rgba(0,0,0,0.5); border-radius:16px;
    padding:10px; opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .18s ease, transform .18s ease, visibility .18s;
    z-index:120;
  }
  .nav-item.wide .submenu{ min-width:520px; }
  .nav-item:hover .submenu, .nav-item.open .submenu, .nav-item:focus-within .submenu{
    opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0);
  }
  /* invisible bridge so the pointer can travel from the pill to the panel */
  .nav-item.has-children::after{
    content:""; position:absolute; top:100%; left:0; right:0; height:16px; background:transparent;
  }
  .submenu-grid{ display:grid; grid-template-columns:1fr; gap:2px; }
  .nav-item.wide .submenu-grid{ grid-template-columns:1fr 1fr; }
  .submenu a{
    display:block; color:var(--ink); text-decoration:none; font-size:15px; opacity:0.9; font-weight:500;
    padding:11px 14px; border-radius:10px; transition:opacity .15s, background .15s, color .15s;
  }
  .submenu a:hover{ opacity:1; background:rgba(255,90,54,0.16); color:var(--coral-dark); }
}
@media(min-width:1080px) and (max-width:1320px){
  .nav-item > .nav-link{ padding:11px 10px; font-size:14.5px; }
  .nav-toggle{ padding:11px 10px 11px 3px; }
}

.nav-actions{ display:flex; align-items:center; justify-content:flex-end; gap:10px; flex:none; }
.nav-actions .btn{ padding:12px 20px; font-size:14.5px; white-space:nowrap; }
@media(max-width:1079px){ .nav-actions .btn{ display:none; } }
.hamburger{ display:flex; flex-direction:column; gap:4px; background:none; border:0; padding:8px; }
@media(min-width:1080px){ .hamburger{ display:none; } }
.hamburger span{ width:24px; height:2px; background:var(--ink); display:block; border-radius:2px; }

.mobile-menu{
  display:none; flex-direction:column; padding:10px var(--edge) 28px; border-top:1px solid var(--line);
  max-height:calc(100vh - 80px); overflow-y:auto; background:var(--paper);
}
.mobile-menu.open{ display:flex; }
.mobile-nav-item{ border-bottom:1px solid var(--line); }
.mobile-nav-item > a, .mobile-nav-item > button{
  width:100%; display:flex; align-items:center; justify-content:space-between; background:none; border:0;
  color:var(--ink); text-decoration:none; padding:16px 0; font-size:17px; font-weight:600; font-family:var(--body); text-align:left;
}
.mobile-nav-item .nav-caret{ width:11px; height:11px; transition:transform .2s; }
.mobile-nav-item.open .nav-caret{ transform:rotate(180deg); }
.mobile-submenu{ display:none; flex-direction:column; padding:0 0 16px 14px; }
.mobile-nav-item.open .mobile-submenu{ display:flex; }
.mobile-submenu a{ color:var(--ink-soft); text-decoration:none; padding:11px 0; font-size:15.5px; }
.mobile-submenu a.ms-parent{ color:var(--coral-dark); font-weight:600; font-family:var(--mono); font-size:12.5px; letter-spacing:0.04em; text-transform:uppercase; }
@media(min-width:1080px){ .mobile-menu{ display:none !important; } }

/* ============================================================
   HERO — one fixed screen, copy left / animated orbit right
   ============================================================ */
.hero{
  position:relative; overflow:hidden;
  background-color:#140A22;
  min-height:calc(100vh - 81px); min-height:calc(100svh - 81px);
}
.hero-slider{ position:absolute; inset:0; z-index:0; }
.hero-slide{
  position:absolute; inset:0; opacity:0; visibility:hidden; z-index:0;
  transition:opacity 1.1s ease, visibility 0s linear 1.1s;
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(48px,10vh,110px) 0 clamp(56px,11vh,120px);
}
.hero-slide.is-active{ opacity:1; visibility:visible; z-index:1; transition:opacity 1.1s ease; }
@media(prefers-reduced-motion:reduce){ .hero-slide{ transition:none; } }
/* slide 1 — copy over the backdrop image */
.hero-slide--main{
  background:
    linear-gradient(180deg, rgba(20,11,34,0.55) 0%, rgba(17,20,46,0.32) 42%, rgba(14,30,40,0.58) 100%),
    url("../img/ipabackdrop2.png") center center / cover no-repeat,
    linear-gradient(135deg,#2A1140 0%,#1C2E52 60%,#0F3B3A 100%);
}
.hero-grid{ position:relative; z-index:2; width:100%; }
.hero-copy{ text-align:center; max-width:1060px; margin:0 auto; }

.hero h1{
  font-size:clamp(30px,5.2vw,64px); line-height:1.05; font-weight:700; letter-spacing:-0.024em; color:#fff;
  max-width:none; margin-inline:auto; text-shadow:0 2px 18px rgba(0,0,0,0.2);
}
.hero h1 em{ font-style:italic; font-family:var(--editorial); color:#FFD54A; font-weight:500; }
.hero .lede{
  margin:clamp(16px,2.4vh,26px) auto 0; max-width:64ch;
  font-size:clamp(16px,1.8vw,20px); line-height:1.6; color:rgba(255,255,255,0.95);
}
.hero .cta-row{ margin-top:clamp(18px,3vh,32px); display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }
.hero .cta-row .btn{ padding:13px 22px; font-size:14.5px; }

/* slide 2 — conference banner image + Register Now CTA */
.hero-slide--banner{ background:#0B0B14; }
.hero-slide-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.hero-slide-scrim{
  position:absolute; left:0; right:0; bottom:0; height:30%; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(8,8,17,0) 0%, rgba(8,8,17,0.72) 65%, rgba(8,8,17,0.9) 100%);
}
.hero-slide-cta{
  position:absolute; left:50%; bottom:clamp(120px,18vh,180px); transform:translateX(-50%);
  z-index:2; display:inline-flex; align-items:center; gap:8px;
  padding:15px 30px; font-size:15px; white-space:nowrap;
  box-shadow:0 12px 30px rgba(0,0,0,0.45);
}
@media(max-width:640px){ .hero-slide-cta{ bottom:clamp(96px,20vh,140px); padding:13px 22px; font-size:14px; } }

/* hero slide arrows — faint "watermark" style, brightens on hover */
.hero-arrow{
  position:absolute; top:50%; transform:translateY(-50%); z-index:6;
  width:58px; height:58px; display:flex; align-items:center; justify-content:center;
  background:transparent; border:none; padding:0; margin:0; cursor:pointer;
  color:#fff; opacity:0.3; transition:opacity .3s ease, transform .3s ease;
}
.hero-arrow svg{ width:36px; height:36px; filter:drop-shadow(0 2px 6px rgba(0,0,0,0.35)); }
.hero-arrow:hover{ opacity:0.85; }
.hero-arrow:focus-visible{ opacity:0.9; outline:2px solid rgba(255,255,255,0.55); outline-offset:6px; border-radius:50%; }
.hero-arrow--prev{ left:clamp(6px,2.6vw,32px); }
.hero-arrow--next{ right:clamp(6px,2.6vw,32px); }
.hero-arrow--prev:hover{ transform:translateY(-50%) translateX(-4px); }
.hero-arrow--next:hover{ transform:translateY(-50%) translateX(4px); }
@media(max-width:640px){ .hero-arrow{ width:40px; height:40px; } .hero-arrow svg{ width:24px; height:24px; } }

/* ---- drifting background shapes ---- */
.hero-shapes{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
/* six identical circles — same size, same treatment, evenly spread; translate-only drift */
.hs{ position:absolute; display:block; width:112px; height:112px; border-radius:50%; will-change:transform; opacity:0.32; filter:blur(1px); }
.hs-1{ left:7%;   top:18%;    background:#0EA394; animation:hs-drift-1 27s ease-in-out infinite; }
.hs-2{ left:29%;  top:60%;    background:#FFC93C; animation:hs-drift-2 34s ease-in-out infinite; }
.hs-3{ right:29%; top:14%;    background:#F0508B; animation:hs-drift-3 23s ease-in-out infinite; }
.hs-4{ right:7%;  top:52%;    background:#8B5CF6; animation:hs-drift-4 31s ease-in-out infinite; }
.hs-5{ left:16%;  bottom:12%; background:#FF5A36; animation:hs-drift-5 37s ease-in-out infinite; }
.hs-6{ right:19%; bottom:9%;  background:#2F80ED; animation:hs-drift-6 30s ease-in-out infinite; }

@keyframes hs-drift-1{ 0%,100%{ transform:translate(0,0); } 33%{ transform:translate(48px,-34px); } 66%{ transform:translate(-30px,28px); } }
@keyframes hs-drift-2{ 0%,100%{ transform:translate(0,0); } 50%{ transform:translate(56px,-24px); } }
@keyframes hs-drift-3{ 0%,100%{ transform:translate(0,0); } 40%{ transform:translate(-42px,32px); } 70%{ transform:translate(24px,-26px); } }
@keyframes hs-drift-4{ 0%,100%{ transform:translate(0,0); } 50%{ transform:translate(-50px,-38px); } }
@keyframes hs-drift-5{ 0%,100%{ transform:translate(0,0); } 25%{ transform:translate(34px,22px); } 50%{ transform:translate(-26px,38px); } 75%{ transform:translate(-36px,-20px); } }
@keyframes hs-drift-6{ 0%,100%{ transform:translate(0,0); } 50%{ transform:translate(46px,-32px); } }

@media(prefers-reduced-motion:reduce){ .hs{ animation:none !important; } }
@media(max-width:640px){ .hero-shapes .hs-3, .hero-shapes .hs-5{ display:none; } .hs{ width:84px; height:84px; opacity:0.26; } }

/* ---- scroll-down cue ---- */
.scroll-cue{
  position:absolute; left:50%; bottom:26px; transform:translateX(-50%); z-index:5;
  display:flex; flex-direction:column; align-items:center; gap:7px;
  color:rgba(255,255,255,0.82); text-decoration:none;
  font-family:var(--mono); font-size:10.5px; letter-spacing:0.22em; text-transform:uppercase;
  animation:cue-bob 2.2s ease-in-out infinite;
  transition:opacity .3s ease;
}
.scroll-cue:hover{ color:#fff; }
.scroll-cue.gone{ opacity:0; pointer-events:none; }
.scroll-cue-mouse{
  width:24px; height:38px; border:2px solid currentColor; border-radius:13px;
  display:flex; justify-content:center; padding-top:6px;
}
.scroll-cue-mouse span{ width:4px; height:7px; border-radius:2px; background:currentColor; animation:cue-dot 1.7s ease-in-out infinite; }
.scroll-cue-chev{ width:15px; height:9px; margin-top:-2px; animation:cue-dot 1.7s ease-in-out infinite .2s; }
@keyframes cue-bob{ 0%,100%{ transform:translateX(-50%) translateY(0); } 50%{ transform:translateX(-50%) translateY(5px); } }
@keyframes cue-dot{ 0%{ opacity:0; transform:translateY(-3px); } 35%{ opacity:1; } 65%{ opacity:1; transform:translateY(7px); } 100%{ opacity:0; transform:translateY(7px); } }
@media(prefers-reduced-motion:reduce){ .scroll-cue{ animation:none; } .scroll-cue-mouse span, .scroll-cue-chev{ animation:none; opacity:0.8; } }
@media(max-height:640px){ .scroll-cue-txt{ display:none; } .scroll-cue{ bottom:16px; } }

/* ============================================================
   INDUSTRY AT A GLANCE
   ============================================================ */
.stats-section{ background:#0F3B3A; }
.stat-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; position:relative; z-index:2; }
@media(min-width:820px){ .stat-grid{ grid-template-columns:repeat(4,1fr); } }
.stat-card{ background:var(--paper-card); padding:28px 24px 26px; position:relative; border-radius:18px; box-shadow:0 16px 34px -22px rgba(0,0,0,0.4); overflow:hidden; }
.stat-card::before{ content:""; position:absolute; top:0; left:0; width:100%; height:6px; background:var(--c); }
.stat-card .ic{ color:var(--c); margin-bottom:12px; }
.stat-card .num{ font-family:var(--display); font-weight:700; font-size:clamp(30px,3.6vw,44px); color:#FFFFFF; }
.stat-card .num .unit{ font-size:0.5em; font-family:var(--mono); font-weight:400; margin-left:2px; color:var(--c); }
.stat-card .label{ margin-top:10px; font-size:15px; color:var(--ink-soft); }
.stat-source{ margin-top:24px; font-size:15px; color:var(--ink-soft); line-height:1.6; position:relative; z-index:2; max-width:none; }

/* ============================================================
   ABOUT — history timeline (redesigned: vertical spine + nodes)
   ============================================================ */
.timeline-section{ background:#3A1B4D; }

.htl{ list-style:none; margin:24px 0 0; padding:0; position:relative; z-index:2; }
.htl::before{                       /* the spine */
  content:""; position:absolute; top:6px; bottom:6px; left:22px; width:3px; border-radius:2px;
  background:linear-gradient(180deg,#FF5A36,#FFC93C,#0EA394,#2F80ED,#8B5CF6,#3FA66E,#F0508B);
}
.htl-item{ position:relative; padding:0 0 24px 58px; }
.htl-item:last-child{ padding-bottom:0; }
.htl-node{
  position:absolute; left:13px; top:16px; width:20px; height:20px; border-radius:50%;
  background:var(--tc); z-index:2; box-shadow:0 0 0 5px rgba(58,27,77,0.95), 0 0 0 7px var(--tc);
}
.htl-node span{ position:absolute; left:-9999px; }   /* year lives in the card badge */
.htl-card{
  background:var(--paper-card); border-radius:16px; padding:20px 22px;
  border-left:5px solid var(--tc); box-shadow:0 16px 34px -22px rgba(0,0,0,0.4);
  display:flex; gap:18px; align-items:flex-start;
}
.htl-ic{
  flex:none; width:48px; height:48px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--tc); background:rgba(255,255,255,0.07); border:1px solid var(--tc);
}
.htl-body{ flex:1; min-width:0; }
/* alternate icon side — Foundation icon left, Registration icon right, … */
.htl-item:nth-child(even) .htl-card{ flex-direction:row-reverse; }
.htl-yr{
  display:inline-block; font-family:var(--mono); font-size:12.5px; font-weight:700; letter-spacing:0.04em;
  color:var(--tc); background:rgba(255,255,255,0.06); border:1px solid var(--tc);
  padding:4px 12px; border-radius:999px;
}
.htl-card h4{ margin-top:12px; font-size:21px; font-weight:700; color:#FFFFFF; }
.htl-card p{ margin-top:8px; font-size:15px; color:var(--ink-soft); line-height:1.55; }

@media(min-width:900px){
  .htl::before{ left:50%; transform:translateX(-50%); }
  .htl-item{ width:50%; padding:0 0 34px 0; }
  .htl-item:nth-child(odd){ padding-right:46px; }
  .htl-item:nth-child(even){ margin-left:50%; padding-left:46px; }
  .htl-node{ left:auto; top:24px; }
  .htl-item:nth-child(odd) .htl-node{ right:-10px; }
  .htl-item:nth-child(even) .htl-node{ left:-10px; }
  .htl-item:nth-child(odd) .htl-card{ border-left:0; border-right:5px solid var(--tc); }
}

/* ============================================================
   PAINT & COATINGS — redesigned as a colourful swatch wall
   ============================================================ */
.cat-grid{ display:grid; grid-template-columns:1fr; gap:16px; position:relative; z-index:2; }
@media(min-width:640px){ .cat-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1000px){ .cat-grid{ grid-template-columns:repeat(4,1fr); } }
.cat-card{
  background:var(--cc); color:#fff; border-radius:18px; padding:26px 22px; display:flex; flex-direction:column; gap:16px;
  min-height:220px; text-decoration:none; position:relative; overflow:hidden;
  box-shadow:0 18px 36px -20px var(--cc-shadow, rgba(0,0,0,0.35));
  transition:transform .3s ease, box-shadow .3s ease;
}
.cat-card:hover{ transform:translateY(-6px); box-shadow:0 26px 44px -18px var(--cc-shadow, rgba(0,0,0,0.4)); }
.cat-card.dark-text{ color:#221A2E; }
.cat-card .punch{ position:absolute; top:14px; right:16px; width:16px; height:16px; border-radius:50%; background:rgba(255,255,255,0.35); }
.cat-card.dark-text .punch{ background:rgba(34,26,46,0.18); }
.cat-card .blob{ position:absolute; right:-30px; bottom:-30px; width:140px; height:140px; opacity:0.25; }
.cat-icon{ width:42px; height:42px; position:relative; z-index:1; }
.cat-card h4{ font-size:17.5px; font-weight:600; position:relative; z-index:1; }
.cat-card p{ font-size:13.5px; opacity:0.92; flex:1; position:relative; z-index:1; }
.cat-card .learn{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; display:flex; align-items:center; gap:6px; position:relative; z-index:1; font-weight:600; }

/* ============================================================
   MEMBERSHIP
   ============================================================ */
.membership{
  background:linear-gradient(135deg,#0EA394 0%,#0C8E8B 45%,#12658F 100%);
  color:#fff; position:relative; overflow:hidden; border-top:8px solid var(--yellow);
}
.membership .eyebrow{ color:var(--yellow); font-size:14px; }
.membership .eyebrow::before{ background:var(--yellow); }
.membership .section-head h2{ font-size:clamp(28px,4vw,42px); color:#fff; }
.membership .section-head .sub{ color:rgba(255,255,255,0.92); font-size:21px; }
.membership-flag{
  display:inline-flex; align-items:center; gap:9px; background:var(--yellow); color:#221A2E;
  font-family:var(--mono); font-weight:700; font-size:12.5px; letter-spacing:0.1em; text-transform:uppercase;
  padding:8px 16px; border-radius:999px; margin-bottom:18px;
}
.member-lead{ position:relative; z-index:2; max-width:820px; }
.benefit-list{ display:grid; grid-template-columns:1fr; gap:16px; margin-top:32px; position:relative; z-index:2; }
@media(min-width:640px){ .benefit-list{ grid-template-columns:1fr 1fr; } }
.benefit{ background:#fff; color:#221A2E; border-radius:16px; padding:24px; display:flex; gap:18px; align-items:center; border-left:6px solid var(--bc); box-shadow:0 16px 34px -22px rgba(0,0,0,0.35); }
.benefit-ic{
  flex:none; width:60px; height:60px; border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  color:#fff; background:var(--bc);
}
.benefit-ic .ic{ width:34px; height:34px; }
.benefit p{ font-size:15.5px; font-weight:600; line-height:1.5; }
.member-cats{ margin-top:28px; font-size:16px; color:rgba(255,255,255,0.92); position:relative; z-index:2; max-width:760px; }
.member-cats strong{ color:#fff; }
.member-cta{ margin-top:30px; display:flex; gap:14px; flex-wrap:wrap; position:relative; z-index:2; }
.member-cta .btn-primary{ background:var(--yellow); color:#221A2E; box-shadow:0 12px 28px -10px rgba(255,201,60,0.7); font-size:16.5px; padding:16px 30px; }
.member-cta .btn-primary:hover{ background:#FFDD85; }

/* ---------- How to Apply — its own section ---------- */
.apply-section{ background:#2E1B4A; }
.apply-grid{ display:grid; grid-template-columns:1fr; gap:18px; position:relative; z-index:2; }
@media(min-width:820px){ .apply-grid{ grid-template-columns:repeat(3,1fr); } }
.apply-card{ background:var(--paper-card); border-radius:18px; padding:28px 24px; border-top:6px solid var(--ac, var(--coral)); box-shadow:0 16px 34px -22px rgba(0,0,0,0.4); }
.apply-card .step-row{ display:flex; align-items:center; gap:14px; }
.apply-card .ic{ color:var(--ac, var(--coral)); flex:none; }
.apply-card .idx{ font-family:var(--display); font-weight:700; font-size:34px; color:var(--ac, var(--coral)); line-height:1; margin-left:auto; }
.apply-card h4{ margin-top:16px; font-size:20px; font-weight:700; color:#FFFFFF; }
.apply-card p{ margin-top:8px; font-size:15px; color:var(--ink-soft); line-height:1.55; }

/* ---------- Conference (Events menu target) ---------- */
.conf-section{
  /* Chennai skyline watercolour (img/ipaconf.png) sitting on the bottom edge */
  background:
    url("../img/ipaconf.png") center bottom / min(1600px, 112%) auto no-repeat,
    linear-gradient(120deg,#FF5A36,#B4459F 55%,#2F80ED);
  padding-bottom:clamp(170px, 30vw, 440px);
}
@media(max-width:640px){
  .conf-section{ background-size:180% auto, auto; padding-bottom:clamp(96px, 40vw, 210px); }
}
.conf-card{
  position:relative; z-index:2;
  display:flex; align-items:center; justify-content:space-between; gap:36px; flex-wrap:wrap;
}
.conf-info{ flex:1 1 340px; min-width:0; text-align:left; }     /* event details — left */
.conf-card .kicker{ display:flex; align-items:center; gap:10px; color:#FFE3A6; font-family:var(--mono); font-size:13px; letter-spacing:0.14em; text-transform:uppercase; margin-bottom:16px; font-weight:600; }
.conf-card .kicker span{ width:20px; height:3px; background:#FFE3A6; display:block; border-radius:2px; }
.conf-card h2{ color:#fff; font-size:clamp(30px,4.4vw,50px); line-height:1.08; font-weight:700; }
.conf-card h2 a{ color:inherit; text-decoration:none; }
.conf-card h2 a:hover{ text-decoration:underline; text-underline-offset:4px; }
.conf-meta{ margin-top:18px; display:flex; flex-wrap:wrap; gap:14px 26px; }
.conf-meta span{ display:inline-flex; align-items:center; gap:9px; color:#fff; font-size:17px; font-weight:500; }
.conf-meta .ic{ color:#FFE3A6; }
.conf-cta{ flex:none; display:flex; flex-direction:column; gap:10px; align-items:stretch; }  /* CTA stack — right */
.conf-cta .btn{ justify-content:center; }
@media(max-width:720px){ .conf-cta{ width:100%; } }
.conf-cta .btn-primary{ background:#fff; color:var(--coral-dark); }

/* blinking "Register Now" call-to-action */
.btn-blink{ animation:btn-blink 1.2s ease-in-out infinite; }
.btn-blink .ic{ flex:none; }
@keyframes btn-blink{
  0%, 100%{ opacity:1;   box-shadow:0 0 0 0 rgba(255,255,255,0.55); }
  50%     { opacity:0.6; box-shadow:0 0 0 12px rgba(255,255,255,0); }
}
@media(prefers-reduced-motion:reduce){ .btn-blink{ animation:none; } }

/* ============================================================
   EVENTS
   ============================================================ */
.filters{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:32px; position:relative; z-index:2; }
.filter-btn{
  background:var(--paper-card); border:1.5px solid var(--line); padding:9px 18px; border-radius:999px;
  font-family:var(--mono); font-size:12.5px; letter-spacing:0.02em; color:var(--ink-soft);
}
.filter-btn.active{ background:var(--coral); border-color:var(--coral); color:#fff; }
.event-grid{ display:grid; grid-template-columns:1fr; gap:26px; position:relative; z-index:2; }
@media(min-width:720px){ .event-grid{ grid-template-columns:1fr 1fr; } }
@media(min-width:1080px){ .event-grid{ grid-template-columns:repeat(3,1fr); } }
.event-card{ display:flex; flex-direction:column; }
.event-thumb{ aspect-ratio:4/3; border-radius:16px; position:relative; overflow:hidden; }
.event-thumb .tag{
  position:absolute; top:14px; left:14px; background:rgba(255,255,255,0.92); color:#221A2E; font-family:var(--mono);
  font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase; padding:6px 10px; border-radius:999px; font-weight:600;
}
.event-meta{ margin-top:16px; font-family:var(--mono); font-size:12px; color:var(--ink-soft); display:flex; gap:14px; }
.event-card h4{ margin-top:10px; font-size:19px; font-weight:600; }
.event-card p{ margin-top:8px; font-size:14px; color:var(--ink-soft); }
.event-card .btn{ margin-top:16px; align-self:flex-start; }

/* ---- Events listing: confirmed + coming-soon cards ---- */
.ev-grid{ display:grid; grid-template-columns:1fr; gap:22px; position:relative; z-index:2; }
@media(min-width:760px){ .ev-grid{ grid-template-columns:1fr 1fr; } }
.ev-grid--single{ grid-template-columns:1fr !important; max-width:560px; margin-inline:0; }
.ev-card{
  background:var(--paper-card); border-radius:18px; padding:28px 26px;
  border-top:6px solid var(--ec, var(--coral)); box-shadow:0 16px 34px -22px rgba(0,0,0,0.4);
  display:flex; flex-direction:column; align-items:flex-start;
}
.ev-tag{
  font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; font-weight:700;
  padding:5px 12px; border-radius:999px; margin-bottom:14px;
}
.ev-tag--confirmed{ background:rgba(63,166,110,0.18); color:var(--green-dark); border:1px solid var(--green); }
.ev-tag--soon{ background:rgba(255,255,255,0.06); color:var(--ink-soft); border:1px dashed rgba(255,255,255,0.4); }
.ev-card h3{ font-size:21px; font-weight:700; color:#FFFFFF; line-height:1.22; }
.ev-meta{ margin-top:14px; display:flex; flex-wrap:wrap; gap:8px 22px; }
.ev-meta span{ display:inline-flex; align-items:center; gap:8px; font-size:14.5px; color:var(--ink-soft); }
.ev-meta .ic{ color:var(--ec, var(--coral-dark)); flex:none; }
.ev-card p{ margin-top:14px; font-size:15px; color:var(--ink-soft); line-height:1.6; }
.ev-card .btn{ margin-top:20px; }
.ev-card--soon{
  border:1.5px dashed rgba(255,255,255,0.22); background:rgba(255,255,255,0.03);
  box-shadow:none; justify-content:center;
}
.ev-card--soon h3{ color:var(--ink-soft); }
.ev-card--soon p{ font-style:italic; }

/* ============================================================
   NEWS
   ============================================================ */
.news-layout{ display:grid; grid-template-columns:1fr; gap:32px; position:relative; z-index:2; }
@media(min-width:980px){ .news-layout{ grid-template-columns:1.3fr 1fr; } }
.feature-story{ position:relative; }
.feature-thumb{ aspect-ratio:16/10; border-radius:18px; }
.feature-story .cat{ margin-top:20px; font-family:var(--mono); font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; font-weight:700; }
.feature-story h3{ margin-top:12px; font-size:clamp(22px,3vw,32px); line-height:1.15; }
.feature-story p{ margin-top:12px; color:var(--ink-soft); max-width:60ch; }
.story-list{ display:flex; flex-direction:column; gap:0; }
.story-row{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); }
.story-row .thumb{ width:84px; height:84px; flex:none; border-radius:12px; }
.story-row .cat{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase; font-weight:700; }
.story-row h4{ margin-top:6px; font-size:15px; line-height:1.3; font-weight:600; }

/* ============================================================
   RESOURCES
   ============================================================ */
.res-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; position:relative; z-index:2; }
@media(min-width:720px){ .res-grid{ grid-template-columns:repeat(4,1fr); } }
.res-grid--single{ grid-template-columns:1fr !important; max-width:340px; }
.res-item{
  background:var(--paper-card); padding:24px; text-decoration:none; color:var(--ink); font-size:16.5px; font-weight:600;
  display:flex; align-items:center; gap:14px; border-radius:14px; border-left:5px solid var(--rc);
  transition:background .2s, transform .2s;
}
.res-item .ic{ color:var(--rc); flex:none; }
.res-item:hover{ background:var(--paper-alt); transform:translateX(3px); }

/* ============================================================
   REGIONAL PRESENCE CARDS
   ============================================================ */
.region-grid{ display:grid; grid-template-columns:1fr; gap:16px; position:relative; z-index:2; }
@media(min-width:640px){ .region-grid{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:1080px){ .region-grid{ grid-template-columns:repeat(4,1fr); } }
.region-card{ background:var(--paper-card); border-radius:16px; padding:24px 22px; border-top:5px solid var(--rgc); box-shadow:0 16px 34px -22px rgba(0,0,0,0.4); }
.region-card .tag{ font-family:var(--mono); font-size:12.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--rgc); font-weight:700; }
.region-card h4{ margin-top:12px; font-size:17px; font-weight:700; color:#FFFFFF; }
.region-card h4 .ic{ color:var(--rgc); flex:none; }
.region-card .chair{ margin-top:4px; font-size:13.5px; color:var(--ink-soft); font-weight:500; }
.region-card p.note{ margin-top:12px; font-size:13px; color:var(--ink-soft); line-height:1.5; }
.leader-strip{ display:grid; grid-template-columns:1fr; gap:12px; margin-bottom:36px; position:relative; z-index:2; }
@media(min-width:720px){ .leader-strip{ grid-template-columns:repeat(3,1fr); } }
.leader-chip{ background:var(--paper-card); border-radius:12px; padding:16px 18px; display:flex; align-items:center; gap:12px; }
.leader-chip .dot{ width:10px; height:10px; border-radius:50%; background:var(--lc); flex:none; }
.leader-chip .role{ font-family:var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-soft); }
.leader-chip .who{ font-size:15.5px; font-weight:700; margin-top:3px; color:#FFFFFF; }

/* ============================================================
   CII / ASCON AFFILIATION STRIP
   ============================================================ */
.affil-strip{ display:flex; flex-wrap:wrap; align-items:center; gap:22px; justify-content:center; position:relative; z-index:2; }
.affil-badge{ width:64px; height:64px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:700; font-size:14px; color:#fff; flex:none; }

/* ============================================================
   PHOTO / VIDEO GALLERY PLACEHOLDER
   ============================================================ */
.gallery-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; position:relative; z-index:2; }
@media(min-width:720px){ .gallery-grid{ grid-template-columns:repeat(3,1fr); } }
.gallery-tile{ aspect-ratio:4/3; border-radius:14px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:#fff; text-align:center; padding:14px; }
.gallery-tile svg{ width:28px; height:28px; opacity:0.85; }
.gallery-tile span{ font-size:12.5px; font-weight:600; opacity:0.95; }

/* ============================================================
   ABOUT IPA — foundation copy, objectives, present role
   ============================================================ */
.about-grid{ display:grid; grid-template-columns:1fr; gap:26px; position:relative; z-index:2; }
@media(min-width:860px){ .about-grid{ grid-template-columns:1fr 1fr; gap:40px; } }
.about-block{ background:var(--paper-card); border-radius:16px; padding:26px; border-left:5px solid var(--coral); }
.about-block h3{ display:flex; align-items:center; gap:12px; font-size:22px; font-weight:700; margin-bottom:12px; color:#FFFFFF; }
.about-block h3 .ic{ color:var(--coral-dark); flex:none; }
.about-block p{ font-size:16.5px; color:var(--ink-soft); line-height:1.6; }
.about-block p + p{ margin-top:12px; }

.subhead{ margin:52px 0 20px; font-size:16px; font-family:var(--mono); letter-spacing:0.08em; text-transform:uppercase; color:var(--coral-dark); font-weight:700; position:relative; z-index:2; }

.obj-list{ display:grid; grid-template-columns:1fr; gap:14px; position:relative; z-index:2; list-style:none; margin:0; padding:0; }
@media(min-width:760px){ .obj-list{ grid-template-columns:1fr 1fr; } }
.obj-list li{ background:var(--paper-card); border-radius:14px; padding:18px 20px; font-size:15.5px; color:var(--ink); border-left:5px solid var(--coral); display:flex; gap:14px; align-items:flex-start; line-height:1.5; }
.obj-list li .ic{ color:var(--coral-dark); flex:none; width:26px; height:26px; }

.role-chips{ display:flex; flex-wrap:wrap; gap:12px; position:relative; z-index:2; }
.role-chips span{ display:inline-flex; align-items:center; gap:9px; background:var(--paper-card); border:1px solid var(--line); border-radius:999px; padding:12px 22px; font-family:var(--display); font-weight:600; font-size:15.5px; color:#FFFFFF; }
.role-chips .ic{ color:var(--coral-dark); width:20px; height:20px; }

.about-conclusion{ margin-top:32px; position:relative; z-index:2; }
.about-conclusion p{ font-size:16.5px; line-height:1.6; color:var(--ink-soft); }

/* ---------- Leadership ---------- */
.lead-grid{ display:grid; grid-template-columns:1fr; gap:18px; margin-top:8px; position:relative; z-index:2; }
@media(min-width:720px){ .lead-grid{ grid-template-columns:repeat(3,1fr); } }
@media(min-width:720px){
  .lead-grid--2{ grid-template-columns:repeat(2,1fr); max-width:720px; }
}
.lead-card{ background:var(--paper-card); border-radius:14px; padding:18px 18px; border-top:5px solid var(--lc); box-shadow:0 16px 34px -22px rgba(0,0,0,0.4); }
.lead-card .ic{ color:var(--lc); width:24px; height:24px; margin-bottom:8px; }
.lead-card .role{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--lc); font-weight:700; }
.lead-card .who{ margin-top:5px; font-size:18px; font-weight:700; color:#FFFFFF; }
.lead-card .title{ margin-top:5px; font-size:12.5px; font-weight:600; color:var(--ink-soft); line-height:1.4; }
.lead-card .org{ margin-top:3px; font-size:13px; color:var(--ink-soft); opacity:0.78; }
.lead-quote{ margin-top:30px; background:var(--paper-card); border-radius:18px; padding:30px; font-family:var(--editorial); font-style:italic; font-size:clamp(19px,2.4vw,24px); line-height:1.5; color:var(--ink); position:relative; z-index:2; }
.lead-quote span{ display:block; margin-top:16px; font-family:var(--mono); font-style:normal; font-size:13px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); }

/* ---------- Regional office-bearers ---------- */
.region-card h4{ display:flex; align-items:center; gap:10px; }
.region-card .ob{ margin-top:12px; font-size:15px; color:var(--ink-soft); line-height:1.55; }
.region-card .ob strong{ color:#FFFFFF; font-weight:700; }
.region-card .ob .desig{ font-size:13px; opacity:0.9; }

/* ---------- Policy & Advocacy teaser ---------- */
.pa-grid{ display:grid; grid-template-columns:1fr; gap:18px; position:relative; z-index:2; }
@media(min-width:720px){ .pa-grid{ grid-template-columns:repeat(3,1fr); } }
.pa-card{ background:var(--paper-card); border-radius:18px; padding:28px 24px; border-top:6px solid var(--pc); box-shadow:0 16px 34px -22px rgba(0,0,0,0.4); text-decoration:none; color:var(--ink); display:flex; flex-direction:column; gap:12px; transition:transform .25s ease; }
.pa-card:hover{ transform:translateY(-5px); }
.pa-card .ic{ color:var(--pc); }
.pa-card .tag{ font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--pc); font-weight:700; }
.pa-card h4{ font-size:21px; font-weight:700; color:#FFFFFF; }
.pa-card p{ font-size:15px; color:var(--ink-soft); flex:1; line-height:1.55; }
.pa-card .learn{ font-family:var(--mono); font-size:12.5px; letter-spacing:0.08em; text-transform:uppercase; font-weight:700; color:var(--coral-dark); }

/* ============================================================
   FOUNDING MEMBERS — heritage sub-page
   ============================================================ */
.fm-list{ display:grid; grid-template-columns:1fr; gap:8px; position:relative; z-index:2; list-style:none; margin:0 0 12px; padding:0; counter-reset:fm; }
@media(min-width:640px){ .fm-list{ grid-template-columns:1fr 1fr; } }
@media(min-width:1000px){ .fm-list{ grid-template-columns:1fr 1fr 1fr; } }
.fm-list li{ background:var(--paper-card); border-radius:12px; padding:15px 18px; font-size:15px; color:var(--ink); border-left:4px solid var(--coral); }
.fm-list li .state{ display:block; margin-top:4px; font-family:var(--mono); font-size:11.5px; letter-spacing:0.04em; text-transform:uppercase; color:var(--ink-soft); }

/* ============================================================
   OUR WORK — full activities page
   ============================================================ */
.work-block{ margin-top:28px; position:relative; z-index:2; }
.work-block:first-of-type{ margin-top:0; }
/* tighter vertical rhythm on the Policy & Advocacy and Our Work pages */
.section:has(.work-block){ padding-top:38px; padding-bottom:38px; }
.work-block .subhead{ margin:26px 0 14px; }
.work-block .callout{ margin-top:14px; padding:20px; }
.work-block > h3{
  font-size:clamp(24px,3vw,32px); font-weight:700; color:#FFFFFF;
  display:flex; align-items:center; gap:16px;
}
.work-block > h3 .wb-title{ flex:1; min-width:0; }
.work-block > h3 .ic{
  flex:none; color:var(--wc, var(--coral-dark));
  width:78px; height:78px; padding:16px; border-radius:18px;
  background:rgba(255,255,255,0.07); border:1px solid var(--line);
}
@media(max-width:640px){ .work-block > h3 .ic{ width:60px; height:60px; padding:13px; border-radius:14px; } }
.work-block > p.intro{ margin-top:12px; font-size:17px; color:var(--ink-soft); max-width:64ch; line-height:1.6; }
.work-points{ display:grid; grid-template-columns:1fr; gap:14px; margin-top:16px; list-style:none; padding:0; }
@media(min-width:820px){ .work-points{ grid-template-columns:1fr 1fr; } }
.work-points li{ background:var(--paper-card); border-radius:14px; padding:16px 20px; border-left:5px solid var(--wc, var(--coral)); }
.work-points li strong{ color:#FFFFFF; font-weight:700; font-size:17px; }
.work-points li p{ margin-top:8px; font-size:15px; color:var(--ink-soft); line-height:1.55; }
.callout{ margin-top:24px; background:var(--paper-card); border-radius:18px; padding:28px; font-size:16px; color:var(--ink-soft); line-height:1.65; position:relative; z-index:2; }
.callout strong{ color:#FFFFFF; }

/* ---- compact inner-page title band ---- */
.page-head{ padding-top:clamp(30px,5vh,52px) !important; padding-bottom:clamp(26px,4vh,40px) !important; }
.page-head .section-head{ margin-bottom:0; }
.page-head .section-head h2{ margin:0; }

/* ---- "will update shortly" placeholder card ---- */
.soon-note{
  max-width:620px; margin:0 auto; text-align:center; position:relative; z-index:2;
  background:var(--paper-card); border-radius:18px; padding:44px 36px;
  box-shadow:0 20px 44px -24px rgba(0,0,0,0.45);
}
.soon-note .ic{ color:var(--coral-dark); margin:0 auto 14px; }
.soon-note strong{ display:block; color:#FFFFFF; font-family:var(--body); font-weight:700; font-size:20px; }
.soon-note p{ margin-top:12px; font-size:15px; color:var(--ink-soft); line-height:1.6; }

/* ---- Focus Areas: even-height quote cards (our-work.php) ---- */
.fa-grid{ display:grid; grid-template-columns:1fr; gap:18px; grid-auto-rows:1fr; position:relative; z-index:2; }
@media(min-width:760px){ .fa-grid{ grid-template-columns:1fr 1fr; } }
.fa-card{
  position:relative; background:var(--paper-card); border-radius:16px;
  padding:30px 30px 28px; min-height:210px;
  border-left:5px solid var(--fac, var(--coral)); box-shadow:0 16px 34px -22px rgba(0,0,0,0.4);
  display:flex; flex-direction:column; justify-content:center;
}
.fa-card p{ font-family:var(--editorial); font-style:italic; font-size:clamp(15px,1.5vw,17px); color:var(--ink); line-height:1.62; }
.fa-card .hl{
  font-style:normal; font-weight:600; color:#FFFFFF;
  background:color-mix(in srgb, var(--fac, #FF5A36) 32%, transparent);
  border-radius:4px; padding:1px 4px; margin:0 1px;
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
}

/* ---- home: Policy & Advocacy + Our Work feature cards ---- */
.pw-grid{ display:grid; grid-template-columns:1fr; gap:22px; position:relative; z-index:2; }
@media(min-width:820px){ .pw-grid{ grid-template-columns:1fr 1fr; } }
.pw-card{
  position:relative; overflow:hidden; text-decoration:none;
  background:var(--paper-card); border-radius:22px; padding:38px 34px 30px;
  border-top:6px solid var(--pwc, var(--coral));
  box-shadow:0 22px 46px -26px rgba(0,0,0,0.5);
  display:flex; flex-direction:column; gap:14px;
  transition:transform .28s ease, box-shadow .28s ease;
}
.pw-card::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(120% 80% at 100% 0%, color-mix(in srgb, var(--pwc, #FF5A36) 24%, transparent), transparent 60%);
}
.pw-card > *{ position:relative; z-index:1; }
.pw-card:hover{ transform:translateY(-6px); box-shadow:0 32px 62px -28px rgba(0,0,0,0.62); }
.pw-top{ display:flex; align-items:center; justify-content:space-between; gap:18px; }
.pw-ic{
  flex:none; display:inline-flex; width:64px; height:64px; align-items:center; justify-content:center;
  border-radius:18px; background:rgba(255,255,255,0.07); border:1px solid var(--line);
  color:var(--pwc, var(--coral));
}
.pw-card h3{ margin:0; text-align:left; font-size:clamp(23px,2.8vw,29px); font-weight:700; color:#FFFFFF; }
.pw-card p{ font-size:15.5px; color:var(--ink-soft); line-height:1.6; flex:1; }
.pw-go{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:12.5px;
  letter-spacing:0.08em; text-transform:uppercase; font-weight:700; color:var(--pwc, var(--coral-dark));
}
.pw-go .ic{ transition:transform .25s ease; }
.pw-card:hover .pw-go .ic{ transform:translateX(4px); }

/* ============================================================
   BECOME A MEMBER — request-info form
   ============================================================ */
.join-section{ background:#2E1B4A; }
.join-ok{
  display:flex; align-items:center; gap:12px;
  background:rgba(63,166,110,0.16); border:1px solid var(--green); color:#EAFBF1;
  border-radius:14px; padding:16px 20px; font-size:15.5px; font-weight:600; margin-bottom:26px;
  position:relative; z-index:2;
}
.join-ok .ic{ color:var(--green-dark); flex:none; }
.join-form{
  display:grid; grid-template-columns:1fr; gap:18px 20px; position:relative; z-index:2;
  background:var(--paper-card); border-radius:20px; padding:28px;
  box-shadow:0 20px 44px -24px rgba(0,0,0,0.45); border-top:6px solid var(--coral);
}
@media(min-width:680px){ .join-form{ grid-template-columns:1fr 1fr; padding:32px; } }
.join-form .fld{ display:flex; flex-direction:column; gap:7px; }
.join-form .fld.full{ grid-column:1 / -1; }
.join-form label{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); }
.join-form label span{ color:var(--coral-dark); }
.join-form input, .join-form select, .join-form textarea{
  width:100%; font-family:var(--body); font-size:15px; color:#FFFFFF;
  background:rgba(255,255,255,0.05); border:1.5px solid var(--line); border-radius:10px;
  padding:12px 14px; transition:border-color .2s, background .2s;
}
.join-form textarea{ resize:vertical; min-height:88px; }
.join-form select{ appearance:none; -webkit-appearance:none; }
.join-form input:focus, .join-form select:focus, .join-form textarea:focus{
  outline:none; border-color:var(--coral); background:rgba(255,255,255,0.08);
}
.join-form input::placeholder, .join-form textarea::placeholder{ color:rgba(255,255,255,0.4); }
.join-form option{ color:#111; }
.join-form .fld em{ color:var(--coral-dark); font-size:12.5px; font-style:normal; font-weight:600; }
.join-form .fld.full .btn{ align-self:flex-start; }

/* ============================================================
   CONTACT US — dedicated page
   ============================================================ */
.contact-section{ background:#122A4D; }
.contact-grid{ display:grid; grid-template-columns:1fr; gap:22px; position:relative; z-index:2; }
@media(min-width:900px){ .contact-grid{ grid-template-columns:1.05fr 0.95fr; gap:32px; align-items:start; } }

.contact-card{
  background:var(--paper-card); border-radius:20px; padding:30px; border-left:6px solid var(--coral);
  box-shadow:0 20px 44px -24px rgba(0,0,0,0.45);
}
.contact-card .org{ font-family:var(--display); font-weight:700; font-size:22px; color:#FFFFFF; }
.contact-card .affil{
  display:inline-block; margin-top:8px; font-family:var(--mono); font-size:12px; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--coral-dark); border:1px solid var(--coral); border-radius:999px; padding:4px 12px;
}
.contact-list{ list-style:none; margin:22px 0 0; padding:0; display:flex; flex-direction:column; gap:2px; }
.contact-list li{ display:flex; gap:16px; align-items:flex-start; padding:16px 0; border-top:1px solid var(--line); }
.contact-list li:first-child{ border-top:0; }
.contact-list .ic{ color:var(--coral-dark); flex:none; margin-top:2px; }
.contact-list .k{ font-family:var(--mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); }
.contact-list .v{ margin-top:4px; font-size:16px; color:#FFFFFF; line-height:1.5; }
.contact-list a.v{ color:#FFFFFF; text-decoration:none; }
.contact-list a.v:hover{ color:var(--coral-dark); }

.contact-aside{
  background:var(--paper-card); border-radius:20px; padding:30px; border-top:6px solid var(--teal);
  box-shadow:0 20px 44px -24px rgba(0,0,0,0.45);
}
.contact-aside h3{ font-size:19px; font-weight:700; color:#FFFFFF; }
.contact-aside p{ margin-top:10px; font-size:15px; color:var(--ink-soft); line-height:1.6; }
.contact-map{
  margin-top:20px; height:280px; border-radius:14px; overflow:hidden; position:relative;
  background:var(--paper-alt); border:1px solid var(--line);
}
.contact-map iframe{ width:100%; height:100%; border:0; display:block; filter:saturate(0.95); }

/* ============================================================
   FOOTER — light, colourful
   ============================================================ */
footer{ background:#1E1030; color:var(--ink); padding:64px 0 26px; position:relative; overflow:hidden; border-top:1px solid var(--line); }
.footer-top{ display:grid; grid-template-columns:1fr; gap:40px; position:relative; z-index:2; }
@media(min-width:720px){ .footer-top{ grid-template-columns:repeat(2,1fr); } }
@media(min-width:960px){ .footer-top{ grid-template-columns:1.6fr repeat(5,1fr); } }
footer h5{ font-family:var(--mono); font-size:12.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--coral-dark); margin-bottom:16px; font-weight:700; }
.footer-contact{ margin-top:16px; }
.footer-contact p{ color:var(--ink-soft); font-size:14px; line-height:1.55; }
footer ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; }
footer a{ text-decoration:none; color:var(--ink-soft); font-size:15px; }
footer a:hover{ color:var(--coral-dark); }
.footer-brand p{ margin-top:14px; color:var(--ink-soft); font-size:15px; max-width:36ch; }
.newsletter{ display:flex; margin-top:16px; border:1.5px solid var(--line); max-width:340px; border-radius:999px; overflow:hidden; background:var(--paper-card); }
.newsletter input{ flex:1; background:transparent; border:0; padding:12px 16px; color:var(--ink); font-family:var(--body); font-size:13.5px; }
.newsletter button{ background:var(--coral); color:#fff; border:0; padding:0 20px; font-family:var(--display); font-weight:600; font-size:13px; }
.footer-bottom{ margin-top:52px; padding-top:22px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; font-size:12.5px; color:var(--ink-soft); position:relative; z-index:2; }
.footer-bottom .links{ display:flex; gap:18px; flex-wrap:wrap; }

/* ============================================================
   AFFILIATION — CII / ASCON strip (sits just above the footer)
   ============================================================ */
.affil-section{ background:var(--paper); padding:56px 0; position:relative; overflow:hidden; }
@media(min-width:900px){ .affil-section{ padding:42px 0; } }

.affil-box{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:28px 40px;
  background:var(--paper-card); border-radius:20px; padding:30px 32px;
  border-left:6px solid var(--teal); box-shadow:0 20px 44px -24px rgba(0,0,0,0.45);
  position:relative; z-index:2;
}
.affil-copy{ flex:1 1 320px; min-width:0; }
.affil-text{ font-size:17px; line-height:1.6; color:var(--ink-soft); }
.affil-text strong{ color:#FFFFFF; font-weight:700; }

.affil-logos{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; flex:0 0 auto; }
.affil-logo{
  display:flex; align-items:center; justify-content:center;
  height:72px; min-width:132px; padding:14px 22px;
  background:#FFFFFF; border-radius:14px; box-shadow:0 10px 24px -14px rgba(0,0,0,0.5);
}
.affil-logo img{ max-height:44px; width:auto; }
.affil-logo.placeholder{ background:transparent; border:1.5px dashed rgba(255,255,255,0.35); box-shadow:none; }
.affil-logo.placeholder span{
  font-family:var(--display); font-weight:700; font-size:20px; letter-spacing:0.08em; color:#FFFFFF;
}
.affil-fallback{
  font-family:var(--display); font-weight:700; font-size:22px; letter-spacing:0.06em; color:var(--paper);
}
@media(max-width:620px){
  .affil-box{ padding:24px; }
  .affil-logos{ width:100%; }
  .affil-logo{ flex:1 1 132px; }
}