
:root{
 --maroon:#5b0017; --maroon2:#7b1230; --gold:#d7a62a; --cream:#fffaf4;
 --ink:#351a24; --line:#e8d9d9; --green:#17844c; --blue:#24579b;
}
*{box-sizing:border-box}
body{margin:0;background:#f7f4f1;color:var(--ink);font-family:Arial,"Noto Sans Tamil",sans-serif}
a{text-decoration:none;color:inherit}
.topbar{height:34px;background:#25000a;color:#f4e8c8;display:flex;align-items:center;justify-content:center;font-size:13px;overflow:hidden}
.banner{width:100%;background:#16070a}
.banner img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.nav{background:var(--maroon);color:#fff;display:flex;justify-content:center;flex-wrap:nowrap;overflow-x:auto;border-bottom:3px solid var(--gold);white-space:nowrap;scrollbar-width:thin}
.nav a{padding:11px 12px;font-size:13px;font-weight:700;border-bottom:3px solid transparent;text-align:center;line-height:1.15;flex:0 0 auto}
.nav a:hover,.nav a.active{background:#760d29;border-bottom-color:var(--gold)}
.container{max-width:1420px;margin:auto;padding:22px}
.intro{text-align:center;padding:4px 0 18px}
.intro h1{font-size:40px;margin:0 0 7px;color:#5a1b2a}
.intro p{margin:0;color:#7b6870;font-size:16px}
.tagline{margin-top:9px;color:#6b2a35;font-weight:700}
.quick-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:10px;margin:12px 0 22px}
.quick{background:#fff;border:1px solid #e8e0dc;border-radius:15px;padding:12px 8px;text-align:center;box-shadow:0 3px 12px #0000000d}
.quick .ico{font-size:27px;height:38px}
.quick b{display:block;font-size:15px;margin:4px 0}
.quick span{font-size:11px;color:#7a626a}
.quick .btn{display:inline-block;margin-top:8px;border:1px solid #e3b8bd;border-radius:14px;padding:4px 12px;font-size:11px;color:#8b1830}
.hero-event{background:linear-gradient(100deg,#160f18,#321524);border-radius:20px;overflow:hidden;display:grid;grid-template-columns:.82fr 1.18fr;min-height:350px;box-shadow:0 10px 30px #2b0b1826;margin-bottom:24px}
.hero-copy{padding:35px 38px;color:#fff;display:flex;flex-direction:column;justify-content:center}
.hero-copy .eyebrow{color:#e2b447;font-weight:700;margin-bottom:8px}
.hero-copy h2{font-size:45px;margin:0;color:#fff}
.hero-copy h2 span{color:#e6b948}
.hero-copy .sub{font-size:18px;margin:10px 0 20px;color:#eadfe4}
.meta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}
.meta span{background:#ffffff12;border:1px solid #ffffff24;border-radius:20px;padding:8px 12px;font-size:13px}
.ticket{align-self:flex-start;background:#f1bd43;color:#2c1520;border:0;border-radius:9px;padding:11px 20px;font-weight:800}
.hero-img{min-height:350px;background:#000;display:flex;align-items:center;justify-content:center;min-width:0;padding:14px 18px}
.hero-img img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;background:#000}
.event-details{padding:0 22px 22px;background:#fff}
.event-details h3{margin:0;padding-top:18px;font-size:22px}
.artists{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px}
.artist{display:flex;gap:10px;align-items:center;border:1px solid #eee1df;border-radius:12px;padding:9px;background:#fff}
.artist img{width:58px;height:58px;border-radius:10px;object-fit:cover}
.artist b{font-size:13px}.artist small{display:block;color:#816f76;margin-top:3px}
.section-title{background:var(--maroon);color:#fff;border-radius:10px 10px 0 0;padding:12px 16px;font-size:18px;font-weight:700}
.columns{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:18px}
.panel{background:#fff;border-radius:12px;overflow:hidden;border:1px solid #eadede;box-shadow:0 4px 16px #0000000b}
.list{padding:8px 14px}
.list-item{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid #eee}
.list-item:last-child{border:0}
.thumb{width:82px;height:54px;object-fit:cover;border-radius:7px;flex:none}
.list-item b{font-size:14px;line-height:1.35}.list-item small{display:block;color:#9a7f87;margin-top:5px}
.more{display:block;text-align:center;margin:10px 14px 14px;border:1px solid #dfc8cc;border-radius:18px;padding:8px;color:#7c1c33;font-size:13px}
.cards4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:18px}
.card4{border-radius:14px;overflow:hidden;color:#fff;min-height:190px;padding:16px}
.card4 h3{margin:0 0 12px;font-size:18px}.card4 ul{margin:0;padding-left:18px;line-height:1.8;font-size:14px}.card4 .more{color:#fff;border-color:#ffffff66;background:#00000015}
.death{background:linear-gradient(135deg,#3b1730,#67124b)}
.birth{background:linear-gradient(135deg,#126d48,#16915c)}
.wedding{background:linear-gradient(135deg,#a20d3f,#d02d58)}
.directory{background:linear-gradient(135deg,#174d87,#276eb7)}
footer{margin-top:28px;background:#25000a;color:#ead9d9;text-align:center;padding:24px}
footer b{color:#e6b948}
.page{max-width:1100px;margin:auto;padding:35px 22px}
.page h1{color:#64152a}.page .box{background:#fff;padding:22px;border-radius:14px;border:1px solid #eadede;margin-bottom:15px}
@media(max-width:1000px){.quick-grid{grid-template-columns:repeat(4,1fr)}.columns{grid-template-columns:1fr}.cards4{grid-template-columns:repeat(2,1fr)}.hero-event{grid-template-columns:1fr}.hero-img{height:330px}.artists{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.topbar{font-size:11px}.nav a{padding:10px 9px;font-size:12px}.container{padding:12px}.intro h1{font-size:29px}.quick-grid{grid-template-columns:repeat(2,1fr)}.hero-copy{padding:24px}.hero-copy h2{font-size:32px}.artists{grid-template-columns:1fr}.cards4{grid-template-columns:1fr}.banner img{max-height:none}}
.news-status{margin:14px 0;padding:10px 14px;border-radius:10px;background:#fff8e6;border:1px solid #efdca8;color:#6d4b00;font-size:13px}.auto-news-list{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}.auto-news-item{display:block;padding:15px 4px;border-bottom:1px solid #eee1df;transition:.2s}.auto-news-item:hover{background:#fffaf4;padding-left:10px}.auto-news-item h3{margin:5px 0 7px;font-size:17px;color:#4c1b29}.news-cat{font-size:12px;color:#8a1c35;font-weight:700}.news-meta{font-size:12px;color:#8c777e}@media(max-width:700px){.auto-news-list{grid-template-columns:1fr}}

.news-refresh{font-size:13px;color:#8a6b6f;margin:6px 0 14px}.auto-news-item{display:block;text-decoration:none;color:inherit;padding:16px 10px;border-bottom:1px solid #eee}.auto-news-item:hover{background:#faf5f6}.news-cat{font-size:14px;color:#7a1027;margin-bottom:4px}.news-meta{font-size:13px;color:#888;margin-top:6px}

.empty-card{margin:28px 0 18px;color:#ffffffcc;font-size:14px}.card4{min-height:170px}

.topbar{display:none}

.content-loading,.content-empty{padding:18px 12px;color:#8a737a;font-size:14px}.content-empty{padding:24px 14px;text-align:center}.content-detail{border-bottom:1px solid #eee1df}.content-detail summary{list-style:none;cursor:pointer;padding:12px 0;display:flex;gap:10px;align-items:center}.content-detail summary::-webkit-details-marker{display:none}.content-detail summary b{font-size:14px;line-height:1.35}.content-detail summary small{display:block;color:#9a7f87;margin-top:5px}.content-detail .thumb{width:82px;height:54px;object-fit:cover;border-radius:7px}.detail-body{padding:0 10px 14px 92px;color:#5b4a51;font-size:14px;line-height:1.6}.detail-link{display:inline-block;margin-top:8px;color:#7c1c33;font-weight:700}.content-stack{display:grid;gap:14px}.full-detail{background:#fff;border:1px solid #eadede;border-radius:14px;overflow:hidden}.full-detail summary{cursor:pointer;padding:17px 20px;font-weight:800;color:#64152a;font-size:20px}.full-detail-body{padding:0 20px 22px;color:#514249;line-height:1.7}.detail-image{display:block;width:100%;max-height:520px;object-fit:contain;background:#16070a;border-radius:12px;margin:10px 0 18px}.full-detail .ticket{display:inline-block}
@media(max-width:1000px){.hero-event{grid-template-columns:.82fr 1.18fr}.hero-img{min-height:300px;padding:10px 12px}}
@media(max-width:600px){.hero-event{grid-template-columns:1fr}.hero-copy{padding:22px 20px}.hero-copy h2{font-size:30px;line-height:1.08}.hero-copy .sub{font-size:15px}.hero-img{height:auto;min-height:0;padding:10px}.hero-img img{height:auto;width:100%}}

/* v7: compact featured event banner for clearer presentation */
.hero-event{grid-template-columns:.78fr 1.22fr;min-height:315px}
.hero-copy{padding:28px 32px}
.hero-copy h2{font-size:40px;line-height:1.08}
.hero-copy .sub{font-size:16px;margin:8px 0 16px}
.hero-img{min-height:315px;padding:28px 34px}
.hero-img img{width:94%;height:auto;max-height:265px}
.event-highlight{margin:18px 0;padding:15px 18px;border-left:4px solid var(--gold);background:#fff8e8;border-radius:10px;color:#5b3944}
@media(max-width:1000px){.hero-event{grid-template-columns:1fr}.hero-img{min-height:0;height:auto;padding:18px 22px}.hero-img img{width:88%;max-height:none}.hero-copy h2{font-size:36px}}
@media(max-width:600px){.hero-copy{padding:22px 20px}.hero-copy h2{font-size:30px}.hero-img{padding:14px}.hero-img img{width:92%}}
/* v8: show the supplied Paattum Parathamum banner as one complete banner */
.hero-event-full{display:block!important;padding:0!important;overflow:hidden;border-radius:18px!important;background:#0b0b0b!important;border:1px solid #c99b2e!important;}
.hero-event-full>a{display:block;line-height:0;width:100%;}
.hero-full-banner{display:block;width:100%;height:auto;max-height:none;object-fit:contain;object-position:center;margin:0!important;}
@media (max-width:700px){.hero-event-full{border-radius:12px!important}.hero-full-banner{width:100%;height:auto;}}

/* v9: HTML-based featured event banner — performer photo and text are separate elements */
.hero-event-html{display:grid!important;grid-template-columns:1.02fr .62fr 1.18fr!important;min-height:360px!important;padding:0!important;align-items:stretch;background:linear-gradient(105deg,#0b0a0d,#171016 55%,#250d1b)!important;border:1px solid #c99b2e!important;border-radius:18px!important;overflow:hidden!important}
.hero-copy-html{padding:28px 28px!important;justify-content:center!important}
.hero-copy-html h2{font-size:42px!important;line-height:1.06!important;margin:0 0 3px!important}
.hero-english-title{font-size:19px;color:#e5b74c;font-weight:800;margin-top:2px}
.hero-copy-html .sub{font-size:16px!important;margin:8px 0 14px!important}
.hero-copy-html .meta{display:grid;gap:8px;margin-bottom:10px}
.hero-copy-html .meta span{display:block;width:max-content;max-width:100%;padding:7px 11px}
.hero-contact{color:#f1e8eb;font-size:14px;margin:3px 0 13px;font-weight:600}
.hero-sudha-photo{background:linear-gradient(180deg,#24121b,#0d0b0e);display:flex;align-items:flex-end;justify-content:center;overflow:hidden;min-width:0;padding:0 4px}
.hero-sudha-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top;max-width:none}
.hero-event-copy{padding:28px 30px;color:#fff;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(135deg,#160b13,#2a0f22)}
.hero-badge{color:#e5b74c;font-weight:800;font-size:15px;letter-spacing:.4px}
.hero-event-copy h3{font-family:Georgia,serif;font-size:30px;line-height:1.05;margin:7px 0;color:#fff}
.hero-role{color:#e5b74c;font-size:18px;font-weight:800;margin-bottom:8px}
.hero-event-copy p{font-size:14px;line-height:1.55;color:#eadfe4;margin:4px 0 13px}
.hero-features{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:13px}
.hero-features span{font-size:12px;padding:6px 8px;border:1px solid #ffffff25;border-radius:16px;color:#f5edf0}
.hero-ticket{display:inline-block;align-self:flex-start}
@media(max-width:1000px){
 .hero-event-html{grid-template-columns:1fr .72fr 1.08fr!important}
 .hero-copy-html h2{font-size:34px!important}
 .hero-event-copy{padding:22px 20px}
 .hero-event-copy h3{font-size:25px}
 .hero-sudha-photo img{object-position:center top}
}
@media(max-width:700px){
 .hero-event-html{grid-template-columns:1fr!important}
 .hero-copy-html{padding:22px 20px!important}
 .hero-sudha-photo{height:300px;padding:0 28px;order:2}
 .hero-sudha-photo img{width:100%;object-fit:cover;object-position:center top;border-radius:0}
 .hero-event-copy{order:3;padding:22px 20px}
 .hero-copy-html{order:1}
 .hero-copy-html h2{font-size:30px!important}
 .hero-copy-html .meta{display:flex;flex-wrap:wrap}
 .hero-copy-html .meta span{width:auto}
}

/* v10: clearer Sudha portrait + event detail navigation */
.hero-event-html{grid-template-columns:1fr .72fr 1.05fr!important;min-height:365px!important}
.hero-sudha-photo{padding:12px 10px!important;align-items:center!important;background:linear-gradient(180deg,#20101a,#0d0b0e)!important}
.hero-sudha-photo img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center center!important}
.event-click-card{display:flex!important;align-items:center;justify-content:space-between;gap:12px;padding:12px 0!important;color:inherit}
.event-click-card>span:first-child{display:flex;align-items:center;gap:10px;min-width:0}
.event-click-card .thumb{flex:0 0 auto}
.event-arrow{color:#7c1c33;font-weight:800;white-space:nowrap;font-size:13px}
.event-click-card:hover{background:#fff8f4;padding-left:8px!important;padding-right:8px!important;border-radius:8px}
.event-page-hero{background:#130b10;border:1px solid #c99b2e;border-radius:18px;overflow:hidden;box-shadow:0 10px 30px #2b0b1826;margin:18px 0 24px}
.event-page-hero img{display:block;width:100%;height:auto;max-height:620px;object-fit:contain;background:#130b10}
.event-page-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0}
.event-info-box{background:#fff;border:1px solid #eadede;border-radius:12px;padding:14px;text-align:center}
.event-info-box strong{display:block;color:#64152a;margin-top:5px}
.event-description{background:#fff;border:1px solid #eadede;border-radius:14px;padding:22px;line-height:1.8;color:#514249}
.event-description h2,.event-description h3{color:#64152a}
.event-description ul{padding-left:22px}
.artist-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}
.artist-card{background:#fff;border:1px solid #eadede;border-radius:14px;padding:12px;text-align:center}
.artist-card img{width:110px;height:110px;border-radius:12px;object-fit:cover;display:block;margin:0 auto 8px}
.add-artist{border:2px dashed #d8b7bc;display:flex;align-items:center;justify-content:center;min-height:165px;color:#7c1c33;font-weight:800}
.event-book{display:inline-block;margin-top:10px;background:#f1bd43;color:#2c1520;border-radius:9px;padding:13px 24px;font-weight:900}
@media(max-width:900px){.event-page-grid{grid-template-columns:repeat(2,1fr)}.artist-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.hero-event-html{grid-template-columns:1fr!important}.hero-sudha-photo{height:260px!important;padding:12px 35px!important}.hero-event-copy{padding:22px 20px}.event-page-grid{grid-template-columns:1fr}.artist-grid{grid-template-columns:1fr 1fr}.event-page-hero img{max-height:none}.event-click-card{align-items:flex-start}.event-arrow{font-size:12px}}
.detail-image{max-width:100%;max-height:420px;object-fit:cover;border-radius:14px;margin:10px 0}.full-detail summary{cursor:pointer}.full-detail-body{padding:14px 4px}.content-loading,.content-empty{padding:18px;text-align:center;color:#755e66}

/* v20: homepage radio player and clearer navigation */
.home-radio{margin:20px 0;padding:0;background:#fff;border:1px solid #ead7dc;border-radius:18px;overflow:hidden;box-shadow:0 8px 24px rgba(94,0,28,.08)}
.home-radio-head{background:linear-gradient(135deg,#65001d,#8f1737);color:#fff;padding:14px 18px;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:space-between}
.home-radio-head .live-pill{font-size:11px;background:#e11d48;border-radius:999px;padding:5px 9px}
.home-radio-body{padding:18px;background:linear-gradient(135deg,#111827,#2a1020);color:#fff}
.home-radio-now{font-size:17px;font-weight:700;margin-bottom:10px}
.home-radio audio{width:100%;height:44px}
.home-radio-start{margin-top:12px;width:100%;border:0;border-radius:12px;padding:13px 16px;background:#fbbf24;color:#3b0a18;font-size:16px;font-weight:800;cursor:pointer}
.home-radio-status{margin-top:9px;text-align:center;font-size:12px;opacity:.8}
@media(max-width:900px){.nav{justify-content:flex-start}.nav a{padding:10px 9px;font-size:12px}}

/* v21: event banner directly touches the radio banner */
.hero-event-html + .home-radio-compact{margin-top:0!important;margin-bottom:20px!important;}
.hero-event-html{margin-bottom:0!important;}
.home-radio-compact{border-radius:18px!important;}
