/* ==========================================================
   BuildxSpace Event 2026 — design tokens
   Palette: ink / paper / kumkum (red) / gold / teal
   Type: Catamaran (display) + Hind Madurai (body)
   ========================================================== */

:root{
  --ink:#2A1810;
  --paper:#FBF3E7;
  --paper-dim:#F1E3CC;
  --kumkum:#A6283B;
  --kumkum-dark:#7E1E2C;
  --gold:#C89B3C;
  --teal:#1F5C57;
  --line: rgba(42,24,16,0.16);
  --radius: 3px;
  --maxw: 1160px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; }
}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Hind Madurai', 'Noto Sans Tamil', sans-serif;
  font-size:16px;
  line-height:1.6;
}

h1,h2,h3,.wordmark{
  font-family:'Catamaran','Noto Sans Tamil', sans-serif;
  font-weight:800;
  margin:0;
  color:var(--ink);
}

a{ color:inherit; text-decoration:none; }

:focus-visible{
  outline:2.5px solid var(--kumkum);
  outline-offset:2px;
}

.section-inner{ max-width:var(--maxw); margin:0 auto; padding:5rem 1.5rem; }

.section-head{ max-width:640px; margin-bottom:3rem; }
.section-head h2{ font-size:clamp(1.9rem,3.5vw,2.6rem); }
.section-head p{ margin:0.6rem 0 0; color:rgba(42,24,16,0.72); font-size:1.05rem; }
.section-head.light h2,
.section-head.light p{ color:var(--paper); }
.section-head.light p{ opacity:0.82; }

/* ---------------- NAV ---------------- */
.site-nav{
  position:sticky; top:0; z-index:100;
  background:rgba(251,243,231,0.94);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  max-width:var(--maxw); margin:0 auto; padding:0.9rem 1.5rem;
  display:flex; align-items:center; gap:2rem;
}
.wordmark{
  font-size:1.3rem; font-weight:800; letter-spacing:0.01em;
  display:flex; align-items:baseline; gap:0.35rem; white-space:nowrap;
}
.wordmark-year{ color:var(--kumkum); font-size:0.75rem; font-weight:700; }

.menu{ display:flex; align-items:center; gap:1.6rem; flex:1; }
.menu-item{ position:relative; }
.menu-link{
  background:none; border:none; cursor:pointer;
  font:inherit; font-size:0.98rem; font-weight:600; color:var(--ink);
  padding:0.5rem 0; display:inline-flex; align-items:center; gap:0.3rem;
}
.menu-item.has-sub > .menu-link::after{
  content:''; width:6px; height:6px; border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor;
  transform:rotate(45deg); margin-left:0.15rem; opacity:0.6;
}
.menu-register{
  background:var(--kumkum); color:var(--paper); padding:0.5rem 1.1rem; border-radius:var(--radius);
}
.menu-register:hover{ background:var(--kumkum-dark); }
.menu-register.active{ background:var(--kumkum-dark); }
.menu-item.has-sub.active > .menu-link{ color:var(--kumkum); }
.menu-item.has-sub.active > .menu-link::after{ opacity:1; }
.submenu-hub{ border-top:1px solid var(--line); margin-top:0.2rem; font-weight:700; color:var(--kumkum) !important; }

.submenu{
  position:fixed; top:0; left:0; margin-top:0;
  background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  min-width:280px; padding:0.4rem 0;
  box-shadow:0 12px 24px rgba(42,24,16,0.16);
  opacity:0; visibility:hidden; transform:translateY(4px);
  transition:opacity 0.15s ease, transform 0.15s ease;
  z-index:500;
}
.menu-item.has-sub.open .submenu{
  opacity:1; visibility:visible; transform:translateY(0);
}
.submenu a{
  display:flex; flex-direction:column; padding:0.6rem 1.1rem; font-size:0.92rem; font-weight:600;
  border-left:2px solid transparent;
}
.submenu a:hover{ border-left-color:var(--kumkum); background:var(--paper-dim); }
.submenu a em{ font-style:normal; font-weight:400; font-size:0.82rem; color:rgba(42,24,16,0.6); }
.submenu a em:empty{ display:none; }

.nav-tools{ display:flex; align-items:center; gap:0.6rem; }
.tool-btn{
  border:1px solid var(--line); background:transparent; color:var(--ink);
  border-radius:var(--radius); cursor:pointer; padding:0.45rem 0.65rem;
  display:inline-flex; align-items:center; gap:0.4rem; font:inherit; font-weight:600; font-size:0.85rem;
}
.lang-toggle .lang-en,.lang-toggle .lang-ta{ opacity:0.45; }
.lang-toggle .active{ opacity:1; color:var(--kumkum); }
.lang-sep{ opacity:0.4; }
.music-toggle .icon-music-off{ color:var(--kumkum); }
.whatsapp-pill{
  background:var(--teal); color:var(--paper); border:none;
}
.whatsapp-pill:hover{ background:#164742; }

.hamburger{ display:none; }

/* ---------------- HERO ---------------- */
.hero{ position:relative; overflow:hidden; }
.hero-inner{
  max-width:var(--maxw); margin:0 auto; padding:5rem 1.5rem 4rem;
  display:flex; align-items:center; justify-content:space-between; gap:2.5rem;
}
.hero-copy{ max-width:600px; }
.hero-meta{ margin:0 0 1rem; font-weight:600; color:var(--kumkum); font-size:0.95rem; }
.hero-title{ font-size:clamp(2.6rem,6vw,4.4rem); line-height:1.02; margin-bottom:1.3rem; }
.hero-title span{ color:var(--kumkum); }
.hero-title span.line{ color:var(--ink); }
.hero-sub{ font-size:1.15rem; color:rgba(42,24,16,0.78); max-width:480px; margin:0 0 2rem; }
.hero-ctas{ display:flex; gap:0.9rem; flex-wrap:wrap; }
.hero-kolam{ flex-shrink:0; }
.hero-kolam svg{ width:min(360px,32vw); height:auto; }

.btn{
  display:inline-flex; align-items:center; gap:0.5rem;
  padding:0.85rem 1.5rem; border-radius:var(--radius); font-weight:700; font-size:0.98rem;
  border:1.6px solid transparent; cursor:pointer;
}
.btn-primary{ background:var(--kumkum); color:var(--paper); }
.btn-primary:hover{ background:var(--kumkum-dark); }
.btn-ghost{ border-color:var(--ink); color:var(--ink); }
.btn-ghost:hover{ background:var(--ink); color:var(--paper); }
.btn.full{ width:100%; justify-content:center; }

.kolam-rule{
  height:14px;
  background-image: radial-gradient(circle, var(--gold) 1.6px, transparent 1.8px);
  background-size:22px 22px;
  background-position:center;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  opacity:0.7;
}

/* ---------------- BOTTOM TAB BAR (fixed, mobile only) ---------------- */
.bottom-bar{ display:none; }

/* ---------------- LEDGER (About / Impact) ---------------- */
.ledger-section{ background:var(--paper); }
.ledger{ border-top:1.6px solid var(--ink); }
.ledger-row{
  display:grid; grid-template-columns:minmax(180px,320px) 1fr; gap:2rem;
  padding:1.6rem 0; border-bottom:1.6px solid var(--ink);
  align-items:baseline;
}
.ledger-label span{ font-family:'Catamaran',sans-serif; font-weight:700; font-size:1.15rem; }
.ledger-text{ margin:0; color:rgba(42,24,16,0.78); max-width:56ch; }

/* ---------------- EVENT TRACKS ---------------- */
.tracks-section{ background:var(--ink); }
.tracks{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid rgba(251,243,231,0.25); }
.track{
  padding:2rem 1.6rem; border-right:1px solid rgba(251,243,231,0.25);
  color:var(--paper);
}
.track:last-child{ border-right:none; }
.track h3{ color:var(--paper); font-size:1.15rem; display:flex; flex-direction:column; gap:0.3rem; margin-bottom:0.8rem; }
.track h3 em{ font-style:normal; font-weight:500; font-size:0.78rem; color:var(--gold); }
.track p{ margin:0; color:rgba(251,243,231,0.78); font-size:0.95rem; }

/* ---------------- REGISTRATION BOOTHS ---------------- */
.register-section{ background:var(--kumkum); }
.booths{ display:grid; grid-template-columns:repeat(3,1fr); }
.booth{ border-right:1px solid rgba(251,243,231,0.3); border-bottom:1px solid rgba(251,243,231,0.3); }
.booths .booth:nth-child(3n){ border-right:none; }
.booth{
  background:var(--kumkum); padding:2rem 1.7rem; color:var(--paper);
  display:flex; flex-direction:column; gap:0.5rem;
}
.booth-no{ font-family:'Catamaran',sans-serif; font-weight:800; font-size:0.85rem; color:var(--gold); }
.booth h3{ color:var(--paper); font-size:1.15rem; margin-top:0.2rem; }
.booth em{ font-style:normal; font-size:0.8rem; color:rgba(251,243,231,0.7); }
.booth p{ margin:0.4rem 0 0.6rem; font-size:0.95rem; color:rgba(251,243,231,0.85); flex-grow:1; }
.booth-wa{ font-weight:700; color:var(--gold); font-size:0.92rem; }
.booth-wa:hover{ color:var(--paper); }

.reg-form-wrap{
  margin-top:4rem; background:var(--paper); border-radius:var(--radius); padding:2.4rem;
  max-width:720px;
}
.reg-form-title{ font-size:1.3rem; margin-bottom:1.4rem; }
.reg-form{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem 1.4rem; }
.reg-form label{ display:flex; flex-direction:column; gap:0.4rem; font-size:0.9rem; font-weight:600; }
.reg-form label.full{ grid-column:1 / -1; }
.reg-form input, .reg-form select, .reg-form textarea{
  font:inherit; padding:0.65rem 0.8rem; border:1.6px solid var(--line); border-radius:var(--radius);
  background:var(--paper); color:var(--ink);
}
.reg-form input:focus, .reg-form select:focus, .reg-form textarea:focus{ border-color:var(--kumkum); }

/* ---------------- FOOTER ---------------- */
.site-footer{ background:var(--ink); color:var(--paper); }
.footer-inner{
  max-width:var(--maxw); margin:0 auto; padding:4rem 1.5rem 2.5rem;
  display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2.5rem;
}
.footer-wordmark{ color:var(--paper); font-size:1.25rem; }
.footer-col p{ color:rgba(251,243,231,0.7); font-size:0.92rem; margin:1rem 0 1rem; }
.footer-wa{ font-weight:700; color:var(--gold); font-size:0.92rem; }
.footer-col h4{ font-size:0.95rem; color:var(--gold); margin-bottom:1rem; font-family:'Catamaran',sans-serif; }
.footer-col a{ display:block; font-size:0.9rem; color:rgba(251,243,231,0.82); padding:0.3rem 0; }
.footer-col a:hover{ color:var(--paper); }
.footer-bottom{
  border-top:1px solid rgba(251,243,231,0.15); padding:1.4rem 1.5rem;
  text-align:center; font-size:0.82rem; color:rgba(251,243,231,0.55);
}
.footer-proverb{ margin-top:0.4rem !important; color:var(--gold) !important; font-family:'Catamaran',sans-serif; font-weight:600; font-size:0.88rem !important; }

/* .fab-whatsapp removed — replaced by the fixed bottom tab bar (mobile) */

/* ---------------- PAGE BANNERS ---------------- */
.page-banner{ padding-top:1rem; }
.banner-inner{ padding-top:3rem; padding-bottom:3.5rem; }
.breadcrumb{ font-size:0.85rem; margin:0 0 1.6rem; opacity:0.75; }
.breadcrumb a{ font-weight:600; }
.breadcrumb a:hover{ text-decoration:underline; }
.breadcrumb span{ margin:0 0.3rem; }
.banner-icon{ margin-bottom:1.2rem; opacity:0.9; }
.page-banner h1{ font-size:clamp(2rem,4vw,3rem); margin-bottom:0.7rem; }
.page-banner p{ font-size:1.1rem; max-width:560px; opacity:0.85; margin:0; }

.banner-paper{ background:var(--paper); color:var(--ink); }
.banner-ink{ background:var(--ink); color:var(--paper); }
.banner-teal{ background:var(--teal); color:var(--paper); }
.banner-kumkum{ background:var(--kumkum); color:var(--paper); }
.banner-ink h1, .banner-teal h1, .banner-kumkum h1{ color:var(--paper); }
.banner-ink .breadcrumb, .banner-teal .breadcrumb, .banner-kumkum .breadcrumb{ opacity:0.7; }

.banner-paper-section{ background:var(--paper); }
.banner-ink-section{ background:var(--ink); color:var(--paper); }
.banner-teal-section{ background:#F1E3CC; }
.banner-kumkum-section{ background:var(--paper); }

.hub-intro{ max-width:64ch; font-size:1.1rem; margin:0 0 2.5rem; opacity:0.85; }
.banner-ink-section .hub-intro{ opacity:0.8; }

/* ---------------- HOME HUB TEASERS ---------------- */
.hub-teaser-section{ background:var(--paper); }
.hub-teasers{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.hub-teaser{ background:var(--paper); padding:2rem 1.6rem; display:flex; flex-direction:column; gap:0.6rem; }
.hub-teaser-icon{ color:var(--kumkum); }
.hub-teaser h3{ font-size:1.15rem; }
.hub-teaser p{ margin:0; font-size:0.92rem; color:rgba(42,24,16,0.72); flex-grow:1; }
.hub-teaser-link{ font-weight:700; font-size:0.9rem; color:var(--kumkum); }
.hub-teaser:hover .hub-teaser-link{ text-decoration:underline; }

/* ---------------- LINKED LEDGER (hub pages) ---------------- */
.ledger-row-link{ display:grid; grid-template-columns:minmax(180px,320px) 1fr auto; gap:2rem; cursor:pointer; }
.ledger-row-link:hover{ background:var(--paper-dim); }
.ledger-icon{ display:inline-flex; margin-right:0.6rem; vertical-align:middle; color:var(--kumkum); }
.ledger-arrow{ align-self:center; font-weight:700; color:var(--kumkum); opacity:0; transition:opacity 0.15s; }
.ledger-row-link:hover .ledger-arrow{ opacity:1; }

/* ---------------- LINKED TRACKS (event hub) ---------------- */
.track-link{ display:flex; flex-direction:column; }
.track-icon{ color:var(--gold); margin-bottom:0.8rem; display:inline-block; }
.track-arrow{ margin-top:1rem; font-weight:700; font-size:0.85rem; color:var(--gold); }
.track-link:hover{ background:rgba(251,243,231,0.06); }

/* ---------------- LINKED BOOTHS (register hub) ---------------- */
.booth-link{ text-decoration:none; }
.booth-icon{ color:var(--gold); margin:0.3rem 0 0.2rem; display:inline-block; }
.booth-link:hover{ background:rgba(251,243,231,0.08); }

/* ---------------- DETAIL PAGES ---------------- */
.detail-body{ padding-bottom:1rem; }
.section-inner.narrow{ max-width:760px; }
.detail-intro{ font-size:1.15rem; margin:0 0 1.8rem; max-width:64ch; }
.detail-list{ list-style:none; margin:0 0 2.4rem; padding:0; display:flex; flex-direction:column; gap:0.9rem; }
.detail-list li{ padding-left:1.6rem; position:relative; font-size:1.02rem; }
.detail-list li::before{
  content:''; position:absolute; left:0; top:0.5em; width:8px; height:8px;
  background:var(--kumkum); border-radius:50%;
}
.banner-ink-section .detail-list li::before{ background:var(--gold); }
.detail-ctas{ display:flex; align-items:center; gap:1.4rem; flex-wrap:wrap; margin-bottom:2.4rem; }
.related-link{ font-weight:700; color:var(--kumkum); font-size:0.95rem; }
.banner-ink-section .related-link{ color:var(--gold); }
.back-link{ display:inline-block; font-size:0.92rem; font-weight:600; opacity:0.75; padding-top:1.4rem; border-top:1px solid var(--line); width:100%; }

/* ---------------- ABOUT: checklist row ---------------- */
.checklist-row{ display:flex; flex-wrap:wrap; gap:1.2rem 2.2rem; margin:1.6rem 0 2.6rem; }
.checklist-row .check-item{ display:flex; align-items:center; gap:0.55rem; font-weight:600; font-size:0.92rem; }
.checklist-row .check-item svg{ color:var(--teal); flex-shrink:0; }

/* ---------------- ABOUT: stats band (icon circles) ---------------- */
.about-stats{ display:flex; gap:2.2rem; flex-wrap:wrap; margin:0 0 3rem; padding-bottom:2.5rem; border-bottom:1px solid var(--line); }
.about-stat{ display:flex; align-items:center; gap:0.9rem; }
.about-stat .stat-icon{
  width:52px; height:52px; border-radius:50%; background:var(--paper-dim);
  display:flex; align-items:center; justify-content:center; color:var(--kumkum); flex-shrink:0;
}
.about-stat .stat-num{ font-family:'Catamaran',sans-serif; font-weight:800; font-size:1.9rem; color:var(--ink); line-height:1; }
.about-stat .stat-label{ font-size:0.83rem; opacity:0.7; margin-top:0.15rem; }

/* ---------------- ABOUT: pull quote ---------------- */
.pull-quote{ font-family:'Catamaran',sans-serif; font-weight:700; font-size:1.3rem; text-align:center; margin:2.2rem auto 0; max-width:640px; line-height:1.4; }
.pull-quote .accent{ color:var(--kumkum); }

/* ---------------- ABOUT: story phases ---------------- */
.story-phases{ display:grid; grid-template-columns:repeat(4,1fr); border-top:1.6px solid var(--ink); border-bottom:1.6px solid var(--ink); margin-bottom:1.4rem; }
.story-phase{ padding:1.7rem 1.5rem; border-right:1px solid var(--line); }
.story-phase:last-child{ border-right:none; }
.story-phase .phase-no{ font-weight:800; font-size:0.78rem; color:var(--kumkum); letter-spacing:0.02em; }
.story-phase h4{ font-family:'Catamaran',sans-serif; margin:0.5rem 0 0.5rem; font-size:1.05rem; }
.story-phase p{ margin:0; font-size:0.9rem; color:rgba(42,24,16,0.72); }

/* ---------------- ABOUT: growth framework (5 steps) ---------------- */
.framework-section{ background:var(--ink); margin:0 -1.5rem 3.5rem; padding:3rem 1.5rem; }
.framework-steps{ display:grid; grid-template-columns:repeat(5,1fr); gap:0; border-top:1px solid rgba(251,243,231,0.25); }
.framework-step{ padding:1.7rem 1.3rem; border-right:1px solid rgba(251,243,231,0.25); color:var(--paper); display:flex; flex-direction:column; }
.framework-step:last-child{ border-right:none; }
.framework-step .step-icon{ color:var(--gold); margin-bottom:0.7rem; }
.framework-step h4{ color:var(--paper); font-family:'Catamaran',sans-serif; font-size:1rem; margin-bottom:0.4rem; }
.framework-step p{ margin:0 0 0.8rem; font-size:0.86rem; color:rgba(251,243,231,0.78); flex-grow:1; }
.framework-step a{ font-size:0.82rem; font-weight:700; color:var(--gold); }
.framework-step a:hover{ color:var(--paper); }

.pillars-row{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2.6rem; padding-top:2.4rem; border-top:1px solid rgba(251,243,231,0.2); }
.pillar-chip{
  border:1px solid rgba(251,243,231,0.3); border-radius:var(--radius); padding:1rem 0.8rem;
  text-align:center; flex:1 1 140px; color:var(--paper);
}
.pillar-chip svg{ color:var(--gold); margin-bottom:0.5rem; }
.pillar-chip span{ display:block; font-weight:600; font-size:0.85rem; }

/* ---------------- ABOUT: expertise grid ---------------- */
.expertise-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-bottom:3.5rem; }
.expertise-card{ background:var(--paper); padding:1.8rem 1.6rem; }
.expertise-card .exp-icon{ color:var(--kumkum); margin-bottom:0.8rem; display:inline-block; }
.expertise-card h4{ font-family:'Catamaran',sans-serif; font-size:1rem; margin-bottom:0.4rem; }
.expertise-card p{ margin:0; font-size:0.88rem; color:rgba(42,24,16,0.72); }

/* ---------------- ABOUT: people grid (who we work with / partners) ---------------- */
.people-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.6rem 2rem; margin-bottom:3.5rem; }
.people-row{ display:flex; gap:0.9rem; }
.people-row .p-icon{
  width:44px; height:44px; border-radius:50%; background:var(--paper-dim); color:var(--kumkum);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.people-row h4{ font-size:0.98rem; margin:0 0 0.25rem; font-family:'Catamaran',sans-serif; }
.people-row p{ margin:0; font-size:0.86rem; color:rgba(42,24,16,0.7); }

/* ---------------- ABOUT: story / vision / mission cards ---------------- */
.svm-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin-bottom:3.5rem; }
.svm-card{ border:1px solid var(--line); border-radius:var(--radius); padding:1.7rem; }
.svm-card .svm-icon{ color:var(--kumkum); margin-bottom:0.9rem; display:inline-block; }
.svm-card h4{ font-family:'Catamaran',sans-serif; font-size:1.05rem; margin-bottom:0.6rem; }
.svm-card p{ margin:0; font-size:0.92rem; color:rgba(42,24,16,0.75); }

/* ---------------- ABOUT: audience tags (legacy, kept for compatibility) ---------------- */
.audience-tags{ display:flex; flex-wrap:wrap; gap:0.7rem; margin-bottom:3.5rem; }
.audience-tag{
  border:1.6px solid var(--line); border-radius:999px; padding:0.55rem 1.15rem;
  font-weight:600; font-size:0.9rem; color:var(--ink);
}
.audience-tag:hover{ border-color:var(--kumkum); color:var(--kumkum); }

/* ---------------- GENERIC INFO GRID (purpose/events/knowledge/partners/upcoming) ---------------- */
.info-grid{ display:grid; margin-bottom:3rem; }
.info-card{ border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.info-grid.cols-3 .info-card:nth-child(3n){ border-right:none; }
.info-grid.cols-4 .info-card:nth-child(4n){ border-right:none; }
.info-grid.cols-5 .info-card:nth-child(5n){ border-right:none; }
.info-grid{ border-top:1px solid var(--line); border-left:1px solid var(--line); }
.info-grid.cols-3{ grid-template-columns:repeat(3,1fr); }
.info-grid.cols-4{ grid-template-columns:repeat(4,1fr); }
.info-grid.cols-5{ grid-template-columns:repeat(5,1fr); }
.info-card{ background:var(--paper); padding:1.8rem 1.6rem; display:flex; flex-direction:column; }
.info-card .info-icon{ color:var(--kumkum); margin-bottom:0.8rem; display:inline-block; }
.info-card h4{ font-family:'Catamaran',sans-serif; font-size:1.02rem; margin-bottom:0.5rem; }
.info-card .info-meta{ font-size:0.8rem; color:var(--kumkum); font-weight:700; margin-bottom:0.4rem; }
.info-card p{ margin:0 0 0.9rem; font-size:0.88rem; color:rgba(42,24,16,0.72); flex-grow:1; }
.info-card a.info-link{ font-size:0.85rem; font-weight:700; color:var(--kumkum); }
.info-card a.info-link:hover{ color:var(--kumkum-dark); }

/* ---------------- COUNTERS BAND (dark) ---------------- */
.counters-band{ background:var(--ink); padding:3.2rem 1.5rem; }
.counters-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:1.5rem; max-width:var(--maxw); margin:0 auto; text-align:center; }
.counters-grid .counter-num{ font-family:'Catamaran',sans-serif; font-weight:800; font-size:2.1rem; color:var(--gold); line-height:1; }
.counters-grid .counter-label{ font-size:0.84rem; color:rgba(251,243,231,0.78); margin-top:0.4rem; }

/* ---------------- PURPOSE CARDS (with CTA) ---------------- */
.info-card.has-cta{ text-align:left; }
.info-card .btn{ align-self:flex-start; margin-top:0.4rem; }

/* ---------------- DISCOVERY: tabs + flip cards (mobile: tap to flip) ---------------- */
.discovery-tabs{ display:flex; flex-wrap:wrap; gap:0.6rem; margin-bottom:2rem; }
.discovery-tab{
  border:1.6px solid var(--line); background:var(--paper); padding:0.6rem 1.2rem;
  border-radius:999px; font-weight:600; font-size:0.88rem; cursor:pointer; color:var(--ink);
}
.discovery-tab.active{ background:var(--kumkum); border-color:var(--kumkum); color:var(--paper); }

.flip-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; margin-bottom:0.6rem; }
.flip-card{ background:transparent; height:240px; perspective:1000px; cursor:pointer; }
.flip-card[hidden]{ display:none; }
.flip-card-inner{ position:relative; width:100%; height:100%; transition:transform 0.6s; transform-style:preserve-3d; }
.flip-card:hover .flip-card-inner,
.flip-card.is-flipped .flip-card-inner{ transform:rotateY(180deg); }
.flip-card-front, .flip-card-back{
  position:absolute; width:100%; height:100%; backface-visibility:hidden;
  border-radius:var(--radius); padding:1.5rem; border:1.6px solid var(--line);
}
.flip-card-front{ background:var(--paper); }
.flip-card-back{ background:var(--ink); color:var(--paper); transform:rotateY(180deg); border-color:var(--ink); }
.flip-card-tag{ font-size:0.72rem; color:var(--kumkum); font-weight:800; letter-spacing:0.02em; margin-bottom:0.8rem; display:block; }
.flip-card-back .flip-card-tag{ color:var(--gold); }
.flip-card h4{ font-family:'Catamaran',sans-serif; font-size:1.05rem; margin-bottom:0.5rem; }
.flip-card p{ font-size:0.85rem; color:rgba(42,24,16,0.72); margin:0; }
.flip-card-back p{ color:rgba(251,243,231,0.85); }
.flip-hint{ display:block; font-size:0.72rem; color:rgba(42,24,16,0.45); margin-top:0.7rem; }

/* ---------------- MARKET DISCOVERY (2 cards) ---------------- */
.market-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; margin-bottom:1rem; }
.market-card-2{ border:1.6px solid var(--line); border-radius:var(--radius); padding:2rem; }
.market-card-2 h3{ font-family:'Catamaran',sans-serif; font-size:1.25rem; margin-bottom:0.7rem; }
.market-card-2 ul{ margin:1rem 0 1.4rem; padding-left:1.2rem; color:rgba(42,24,16,0.75); font-size:0.92rem; }
.market-card-2 li{ margin-bottom:0.4rem; }

/* ---------------- SHOWCASE PAGE: domain filter cards ---------------- */
.domain-card{ cursor:pointer; }
.domain-card:hover{ background:var(--paper-dim); }
.domain-card.active{ background:var(--paper-dim); box-shadow:inset 3px 0 0 var(--kumkum); }
.domain-card.active h4{ color:var(--kumkum); }
.type-tag{ display:inline-block; }

/* ---------------- CATEGORY PAGES: alternating text/image split ---------------- */
.split-section{ display:flex; align-items:center; gap:3rem; margin-bottom:1rem; }
.split-section.reverse{ flex-direction:row-reverse; }
.split-text{ flex:1 1 50%; }
.split-image{ flex:1 1 50%; display:flex; justify-content:center; opacity:0.9; }
.split-text h2{ margin-bottom:0.8rem; }
.split-text > p{ margin-bottom:1.2rem; }

/* ---------------- CATEGORY PAGES: swipeable carousel ---------------- */
.carousel-nav{ display:flex; gap:0.6rem; justify-content:flex-end; margin-bottom:1rem; }
.carousel-nav button{
  width:38px; height:38px; border-radius:50%; border:1.6px solid var(--line);
  background:var(--paper); cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--ink);
}
.carousel-nav button:hover{ border-color:var(--kumkum); color:var(--kumkum); }
.carousel{
  display:flex; gap:1.2rem; overflow-x:auto; scroll-snap-type:x proximity;
  padding-bottom:1rem; margin-bottom:0.5rem; -webkit-overflow-scrolling:touch;
}
.carousel-card{
  flex:0 0 260px; scroll-snap-align:start; border:1.6px solid var(--line); border-radius:var(--radius);
  padding:0; background:var(--paper); overflow:hidden; transition:transform 0.15s ease, box-shadow 0.15s ease;
}
.carousel-card:hover{ transform:translateY(-3px); box-shadow:0 10px 22px rgba(42,24,16,0.12); }
.carousel-card-cover{
  height:92px; display:flex; align-items:center; justify-content:center; color:rgba(251,243,231,0.92);
}
.carousel-card-body{ padding:1.3rem 1.4rem 1.5rem; }
.carousel-card[hidden]{ display:none; }
.carousel-card .tag{ font-size:0.72rem; font-weight:800; color:var(--kumkum); margin-bottom:0.6rem; display:block; }
.carousel-card h4{ font-family:'Catamaran',sans-serif; font-size:1.02rem; margin-bottom:0.5rem; }
.carousel-card p{ font-size:0.86rem; color:rgba(42,24,16,0.72); margin:0 0 0.5rem; }
.carousel-empty{ font-size:0.9rem; color:rgba(42,24,16,0.55); padding:2rem 0; }

/* ---------------- AGENDA PAGE: day tabs + timeline ---------------- */
.agenda-tabs{ display:flex; gap:0.7rem; margin-bottom:2.5rem; flex-wrap:wrap; }
.agenda-tab{
  border:1.6px solid var(--line); background:var(--paper); padding:0.65rem 1.3rem;
  border-radius:var(--radius); font-weight:700; font-size:0.95rem; cursor:pointer; color:var(--ink); text-align:left;
}
.agenda-tab .day-time{ display:block; font-size:0.74rem; font-weight:600; opacity:0.65; margin-top:0.15rem; }
.agenda-tab.active{ background:var(--kumkum); border-color:var(--kumkum); color:var(--paper); }
.agenda-tab.active .day-time{ opacity:0.85; }

.agenda-panel[hidden]{ display:none; }
.agenda-timeline{ border-top:1.6px solid var(--ink); }
.agenda-item{
  display:grid; grid-template-columns:92px 40px 1fr; gap:1.3rem;
  padding:1.7rem 0; border-bottom:1px solid var(--line); align-items:start;
}
.agenda-time{ font-weight:700; font-size:0.84rem; color:var(--kumkum); padding-top:0.15rem; }
.agenda-icon{ color:var(--kumkum); }
.agenda-content h4{ font-family:'Catamaran',sans-serif; font-size:1.08rem; margin-bottom:0.5rem; }
.agenda-content .what{ font-size:0.92rem; color:rgba(42,24,16,0.75); margin-bottom:0.5rem; }
.agenda-content .purpose{ font-size:0.84rem; font-weight:700; color:var(--teal); }
.agenda-content .purpose .label{ font-weight:600; opacity:0.7; color:var(--ink); margin-right:0.3rem; }
.agenda-content a.info-link{ margin-top:0.6rem; display:inline-block; }

/* ---------------- HERO CARD (dark, photo-grid style) ---------------- */
.hero-card-section{ padding:1.6rem 1.5rem 0; }
.hero-card{
  max-width:var(--maxw); margin:0 auto; border-radius:28px; overflow:hidden;
  background:
    radial-gradient(circle at 12% 15%, rgba(166,40,59,0.45), transparent 55%),
    radial-gradient(circle at 88% 80%, rgba(31,92,87,0.4), transparent 55%),
    radial-gradient(circle at 75% 10%, rgba(200,155,60,0.3), transparent 50%),
    var(--ink);
  color:var(--paper);
  display:flex; align-items:stretch;
}
.hero-card-text{ flex:1 1 46%; padding:2.6rem 2.4rem; display:flex; flex-direction:column; justify-content:space-between; min-width:0; }
.hero-card-top{ display:flex; align-items:center; justify-content:space-between; }
.hero-card-wordmark{ font-family:'Catamaran',sans-serif; font-weight:800; font-size:1.15rem; display:flex; align-items:baseline; gap:0.4rem; }
.hero-card-wordmark .year-badge{ font-size:0.62rem; font-weight:700; background:rgba(251,243,231,0.15); padding:0.15rem 0.4rem; border-radius:4px; }
.hero-card-headline{ font-family:'Catamaran',sans-serif; font-weight:800; font-size:clamp(1.7rem,2.6vw,2.5rem); line-height:1.18; margin:2rem 0 1.1rem; color:var(--paper); }
.hero-card-meta{ font-size:0.95rem; opacity:0.85; margin-bottom:1.7rem; }
.pill-btn{
  display:inline-flex; align-items:center; gap:0.5rem; background:var(--paper); color:var(--ink);
  padding:0.85rem 1.5rem; border-radius:999px; font-weight:700; font-size:0.95rem; width:fit-content;
}
.pill-btn:hover{ background:var(--gold); }
.hero-card-partner{ display:flex; align-items:center; gap:0.7rem; font-size:0.8rem; opacity:0.75; margin-top:2rem; }
.hero-card-partner .partner-mark{ font-weight:800; font-size:0.72rem; letter-spacing:0.02em; border-left:2px solid rgba(251,243,231,0.4); padding-left:0.6rem; }

.hero-card-photos{ flex:1 1 54%; display:flex; gap:0.8rem; padding:1.1rem 1.1rem 1.1rem 0; }
.photo-col{ flex:1; display:flex; flex-direction:column; gap:0.8rem; }
.photo-col.offset{ margin-top:2.4rem; }
.photo-tile{
  border-radius:16px; display:flex; align-items:center; justify-content:center;
  color:rgba(251,243,231,0.9); position:relative;
}
.photo-tile svg{ width:32%; height:32%; opacity:0.9; }
.tile-tall{ height:190px; }
.tile-med{ height:145px; }
.tile-short{ height:110px; }

/* ---------------- CATEGORY STRIP (Decathlon-style icon row, homepage) ---------------- */
.category-strip{ display:flex; gap:1.6rem; overflow-x:auto; padding-bottom:0.6rem; margin-bottom:1.6rem; }
.category-item{ display:flex; flex-direction:column; align-items:center; gap:0.55rem; flex:0 0 auto; text-align:center; width:78px; }
.category-item .cat-icon{
  width:56px; height:56px; border-radius:50%; background:var(--paper-dim);
  display:flex; align-items:center; justify-content:center; color:var(--kumkum);
  transition:background 0.15s ease, color 0.15s ease;
}
.category-item span:last-child{ font-size:0.78rem; font-weight:600; color:var(--ink); line-height:1.2; }
.category-item:hover .cat-icon{ background:var(--kumkum); color:var(--paper); }

/* ---------------- STALL PAGE: pricing card ---------------- */
.pricing-card{ border:2px solid var(--kumkum); border-radius:var(--radius); padding:2rem; background:var(--paper); max-width:380px; color:var(--ink); }
.pricing-card .price{ font-family:'Catamaran',sans-serif; font-weight:800; font-size:2.6rem; color:var(--kumkum); line-height:1; }
.pricing-card .price-sub{ font-size:0.9rem; opacity:0.7; margin-top:0.3rem; }
.pricing-card .price-days{ margin:1.3rem 0 0; font-size:0.9rem; }
.pricing-card .price-days div{ display:flex; justify-content:space-between; padding:0.5rem 0; border-bottom:1px solid var(--line); }
.pricing-card .price-days div:last-child{ border-bottom:none; }

/* ---------------- STALL PAGE: selectable chips (single & multi select) ---------------- */
.select-chip-group{ display:flex; flex-wrap:wrap; gap:0.7rem; }
.select-chip{
  border:1.6px solid var(--line); border-radius:999px; padding:0.6rem 1.2rem;
  font-weight:600; font-size:0.9rem; cursor:pointer; display:inline-flex; align-items:center; gap:0.5rem;
  background:var(--paper); color:var(--ink);
}
.select-chip:hover{ border-color:var(--kumkum); }
.select-chip.selected{ background:var(--kumkum); border-color:var(--kumkum); color:var(--paper); }
.select-chip .chip-icon{ display:inline-flex; }
.select-group-label{ font-weight:700; font-size:0.95rem; margin-bottom:0.9rem; display:block; }

/* ---------------- STALL PAGE: journey flow ---------------- */
.journey-flow{ display:flex; flex-wrap:wrap; align-items:center; gap:0.6rem; }
.journey-step{
  background:var(--ink); color:var(--paper); padding:0.75rem 1.3rem; border-radius:999px;
  font-weight:700; font-size:0.86rem; white-space:nowrap;
}
.journey-arrow{ color:var(--gold); font-weight:700; font-size:1.1rem; }

/* ---------------- STALL PAGE: digital stall profile mockup ---------------- */
.stall-profile-card{ border:2px solid var(--ink); border-radius:var(--radius); padding:1.7rem; max-width:340px; background:var(--paper); }
.stall-profile-card .stall-no{ font-family:'Catamaran',sans-serif; font-weight:800; color:var(--kumkum); font-size:0.85rem; }
.stall-profile-card h3{ margin:0.3rem 0 0.8rem; }
.stall-profile-card .domain-tag{ display:inline-block; background:var(--paper-dim); padding:0.35rem 0.9rem; border-radius:999px; font-size:0.8rem; margin-bottom:1.1rem; }
.stall-profile-card .field-label{ font-size:0.7rem; font-weight:800; color:var(--teal); margin-top:0.9rem; letter-spacing:0.02em; }
.stall-profile-card .field-value{ font-size:0.92rem; margin-top:0.2rem; }
.stall-profile-actions{ display:flex; gap:0.7rem; margin-top:1.3rem; flex-wrap:wrap; }
.stall-profile-actions .btn{ padding:0.6rem 1.1rem; font-size:0.86rem; }

/* ---------------- STALL PAGE: pricing table ---------------- */
.pricing-table{ width:100%; border-collapse:collapse; margin:1.6rem 0; max-width:520px; }
.pricing-table td{ padding:0.65rem 0; border-bottom:1px solid var(--line); font-size:0.94rem; }
.pricing-table td:last-child{ text-align:right; color:var(--teal); font-weight:800; }

/* ---------------- STALL PAGE: registration form sections ---------------- */
.form-section-title{
  font-family:'Catamaran',sans-serif; font-weight:800; font-size:1.05rem;
  margin:0 0 1rem; display:flex; align-items:center;
}
.form-step-num{
  display:inline-flex; width:26px; height:26px; border-radius:50%; background:var(--kumkum);
  color:var(--paper); align-items:center; justify-content:center; font-size:0.8rem; font-weight:800; margin-right:0.7rem; flex-shrink:0;
}
.form-block{ margin-bottom:2.2rem; padding-bottom:2.2rem; border-bottom:1px solid var(--line); }
.form-block:last-of-type{ border-bottom:none; }

/* ---------------- RESPONSIVE ---------------- */
@media (max-width: 980px){
  .menu, .nav-tools .lang-toggle span:not(.active), .whatsapp-pill span{ display:none; }
  .nav-inner{ gap:0.5rem; flex-wrap:wrap; padding:0.8rem 1rem; }
  .wordmark{ font-size:1.05rem; white-space:nowrap; }
  .nav-tools{ gap:0.35rem; }
  .tool-btn{ padding:0.4rem 0.55rem; }
  .hamburger{
    display:flex; flex-direction:column; justify-content:center; gap:4px;
    width:38px; height:38px; border:1px solid var(--line); background:transparent;
    border-radius:var(--radius); cursor:pointer; margin-left:auto;
  }
  .hamburger span{ height:2px; background:var(--ink); border-radius:2px; }
  .menu{
    display:none; width:100%; flex-direction:column; align-items:flex-start; gap:0.2rem;
    order:3; padding-top:1rem; border-top:1px solid var(--line); margin-top:0.8rem;
  }
  .menu.open{ display:flex; }
  .submenu{ display:none; } /* on mobile, tap the group label to go to its hub page instead */
  .hero-inner{ flex-direction:column; text-align:left; padding:2.2rem 1.2rem 1.8rem; }
  .hero-kolam{ order:-1; opacity:0.45; }
  .hero-kolam svg{ width:130px; }
  .hero-meta{ margin-bottom:0.6rem; }
  .hero-title{ margin-bottom:0.9rem; font-size:2.3rem; }
  .hero-sub{ margin-bottom:1.3rem; font-size:1rem; }
  .quick-links-inner{ padding:1.1rem 0.8rem; }

  .hero-card-section{ padding:1rem 0.9rem 0; }
  .hero-card{ flex-direction:column; border-radius:20px; }
  .hero-card-text{ padding:1.8rem 1.5rem; }
  .hero-card-headline{ font-size:1.6rem; margin:1.4rem 0 0.8rem; }
  .hero-card-photos{ padding:0 1.5rem 1.6rem; }
  .tile-tall{ height:110px; }
  .tile-med{ height:90px; }
  .tile-short{ height:70px; }
  .photo-col.offset{ margin-top:1.2rem; }
  .hero-card-partner{ margin-top:1.4rem; }
  .quick-link{ padding:0.3rem 0.2rem; }
  .quick-link-icon svg{ width:26px; height:26px; }
  .quick-link span{ font-size:0.76rem; }

  /* ================================================================
     SWIPE-ON-MOBILE: every grid/list with several items becomes a
     horizontal, snap-scrolling row on mobile instead of one long
     vertical stack. Desktop keeps the original multi-column grid
     (it isn't the long-scroll problem — mobile stacking is).
     ================================================================ */
  .ledger, .tracks, .booths, .story-phases, .framework-steps,
  .expertise-grid, .people-grid, .svm-grid, .hub-teasers,
  .info-grid.cols-3, .info-grid.cols-4, .info-grid.cols-5,
  .flip-grid, .agenda-timeline{
    display:flex; flex-wrap:nowrap; overflow-x:auto; scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch; gap:1rem; padding-bottom:0.8rem;
    background:none; border:none;
  }
  /* light-background cards: standard border */
  .ledger-row, .story-phase, .expertise-card, .people-row, .svm-card,
  .hub-teaser, .info-card, .agenda-item{
    flex:0 0 240px; scroll-snap-align:start;
    border:1.6px solid var(--line); border-radius:var(--radius);
  }
  /* dark/coloured-background cards: light translucent border instead */
  .track, .booth, .framework-step{
    flex:0 0 220px; scroll-snap-align:start;
    border:1.6px solid rgba(251,243,231,0.3) !important; border-radius:var(--radius);
  }
  /* flip-card already has its own bordered front/back faces — just size it */
  .flip-card{ flex:0 0 240px; scroll-snap-align:start; }
  .ledger-row{ display:flex; flex-direction:column; align-items:flex-start; gap:0.5rem; padding:1.2rem; }
  .ledger-label{ display:flex; align-items:center; }
  .ledger-arrow{ display:none; }
  .track{ padding:1.4rem; border-bottom:1.6px solid rgba(251,243,231,0.3) !important; }
  .booth{ flex:0 0 220px; border-bottom:1.6px solid rgba(251,243,231,0.3) !important; }
  .story-phase{ padding:1.2rem; }
  .framework-step{ padding:1.4rem; border-bottom:1.6px solid rgba(251,243,231,0.3) !important; }
  .people-row{ flex:0 0 250px; padding:1.2rem; }
  .hub-teaser{ flex:0 0 220px; }
  .agenda-item{ flex:0 0 250px; display:flex; flex-direction:column; padding:1.2rem; }
  .agenda-icon{ display:block; margin-bottom:0.4rem; }
  .agenda-time{ padding-top:0; }
  .framework-section{ margin:0 -1.2rem 3rem; }

  .footer-inner{ grid-template-columns:1fr 1fr; }
  .reg-form{ grid-template-columns:1fr; }
  .market-grid-2{ grid-template-columns:1fr; }

  /* Persistent bottom tab bar, fixed to the viewport like a native app */
  body{ padding-bottom:64px; }
  .bottom-bar{
    display:grid; grid-template-columns:repeat(4,1fr);
    position:fixed; left:0; right:0; bottom:0; z-index:150;
    background:var(--paper);
    border-top:1px solid var(--line);
    box-shadow:0 -6px 18px rgba(42,24,16,0.10);
  }
  .bottom-bar-item{
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:0.2rem; padding:0.5rem 0.2rem 0.6rem;
    border-right:1px solid var(--line);
    font-size:0.68rem; font-weight:700; color:var(--ink);
  }
  .bottom-bar-item:last-child{ border-right:none; }
  .bottom-bar-icon{ display:inline-flex; color:var(--ink); }
  .bottom-bar-item.is-whatsapp .bottom-bar-icon{ color:var(--teal); }
  .bottom-bar-icon svg{ width:22px; height:22px; }

  .about-stats{ gap:1.6rem; }
  .pillars-row{ gap:0.7rem; }
  .checklist-row{ gap:0.8rem 1.4rem; }
  .split-section, .split-section.reverse{ flex-direction:column; gap:1.6rem; }
  .split-image{ order:-1; }
  .split-image svg{ width:170px; height:170px; }
  .carousel-card{ flex-basis:220px; }
  .carousel-card-cover{ height:76px; }

  .counters-grid{ grid-template-columns:1fr 1fr; gap:1.4rem 1rem; }
  .discovery-tabs{ overflow-x:auto; flex-wrap:nowrap; padding-bottom:0.3rem; }

  .journey-flow{ flex-wrap:nowrap; overflow-x:auto; padding-bottom:0.6rem; }
  .pricing-card, .stall-profile-card{ max-width:100%; }
}

@media (max-width:560px){
  .flip-card{ height:200px; }
  .footer-inner{ grid-template-columns:1fr; }
  .section-inner{ padding:3.5rem 1.2rem; }
}