/* ==================================================================
   DR. SHARMISTHA BANERJEE — OFFICIAL BRAND KIT: COLORS & FONTS
   Stylesheet: colors/color1.css
   
   Combines Brand Colors, Typography (Google Fonts: Cormorant Garamond
   & Source Sans Pro), CSS Custom Properties, and Theme Overrides.
   ================================================================== */

/* ------------------------------------------------------------------
   1. BRAND FONTS IMPORT
   ------------------------------------------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,600&family=Source+Sans+Pro:ital,wght@0,300;0,400;0,600;0,700;1,400&display=swap');

/* ------------------------------------------------------------------
   2. BRAND KIT DESIGN TOKENS (CSS VARIABLES)
   ------------------------------------------------------------------ */
:root {
    /* Brand Typography */
    --font-heading: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --font-serif:   'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --font-body:    'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-sans:    'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-quote:   'Cormorant Garamond', Georgia, serif;
    --font-accent:  'Cormorant Garamond', Georgia, serif;

    /* ==============================================================
       THE 5 CORE BRAND COLORS
       ============================================================== */
    --color-primary: #8B5A2B;       /* 1. Primary: Saddle Brown (CTAs, buttons, active states) */
    --color-dark:    #2C1A0E;       /* 2. Dark: Deep Espresso (Headings, body text, dark elements) */
    --color-light:   #FAF7F2;       /* 3. Light: Parchment Cream (Canvas page background) */
    --color-accent:  #C48F41;       /* 4. Accent: Caramel Gold (Badges, awards, stars) */
    --color-border:  #E5DCC8;       /* 5. Border: Warm Stone (Dividers, borders, separators) */
    --color-white:   #FFFFFF;       /* Pure White: Card & panel surfaces */

    /* Functional Mappings (Unified to the 5 Core Colors) */
    --primary-color: var(--color-primary);
    --primary-dark:  #5C3317;       /* Darker hover state for primary buttons */
    --accent-color:  var(--color-primary);
    --accent-light:  var(--color-accent);
    --gold:          var(--color-accent);
    --gold-light:    var(--color-accent);
    --dark:          var(--color-dark);
    --darker:        var(--color-dark);
    --light:         var(--color-light);

    /* Surfaces & Borders */
    --surface-white: var(--color-white);
    --surface-warm:  var(--color-light);
    --surface-muted: var(--color-border);
    --border-color:  var(--color-border);
    --border-subtle: var(--color-border);

    /* Text Colors */
    --text-main:     var(--color-dark);
    --text-muted:    #6B5A4A;       /* Secondary descriptive text */
    --text-subtle:   #8A7A6A;       /* Metadata, dates & captions */

    /* Shadows & Effects */
    --glass-bg:      rgba(44, 26, 14, 0.04);
    --glass-border:  rgba(44, 26, 14, 0.10);
    --gradient-aurora: var(--color-primary);
    --gradient-gold: var(--color-accent);
    --shadow-glow:   0 0 60px rgba(139, 90, 43, 0.20);
    --shadow-card:   0 10px 30px rgba(44, 26, 14, 0.08);
}

/* ------------------------------------------------------------------
   3. GLOBAL BRAND TYPOGRAPHY & FONT ASSIGNMENTS
   ------------------------------------------------------------------ */
body {
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.8;
    color: var(--dark);
    background: var(--light);
}

h1, h2, h3, h4, h5, h6,
.section-title,
.section-title-serif,
.serif-heading,
.widgettitle,
.hero-title,
.lead-title,
.editorial-headline,
.events-widget-title,
.editorial-event-title,
.social-widget-title,
.fb-widget-title,
.compact-story-heading,
.compact-ch-title,
.feedback-format-title,
.informed-format-title,
.press-slide-title {
    font-family: var(--font-heading);
    font-weight: 600;
    line-height: 1.3;
    color: var(--dark);
}

.press-vertical-text {
    font-family: var(--font-heading);
    font-weight: 700;
    color: var(--color-primary);
}

blockquote,
.quote-card cite,
.lead-quote,
.testimonial-text,
.editorial-dek,
.editorial-quote-box blockquote,
.band-quote-text {
    font-family: var(--font-quote);
}

.section-eyebrow,
.subhead,
.subtitle {
    font-family: var(--font-accent);
}

.btn,
.nav,
.main-navigation,
.pagination,
.badge,
.label,
.meta-data,
.tagcloud a,
.form-control,
input,
select,
textarea,
table,
.table {
    font-family: var(--font-sans);
}

/* ------------------------------------------------------------------
   4. CORE TEMPLATE PALETTE & COLOR ASSIGNMENTS
   ------------------------------------------------------------------ */
a, .text-primary, .btn-primary .badge, .btn-link,a.list-group-item.active > .badge,.nav-pills > .active > a > .badge, p.drop-caps:first-child:first-letter, .accent-color, .nav-np .next:hover, .nav-np .prev:hover, .basic-link, .pagination > li > a:hover,.pagination > li > span:hover,.pagination > li > a:focus,.pagination > li > span:focus, .icon-box-inline span, .pricing-column h3, .post .post-title a:hover, a, .post-actions .comment-count a:hover, .pricing-column .features a:hover, a:hover, .list-group-item a:hover, .icon-box.ibox-plain .ibox-icon i,.icon-box.ibox-plain .ibox-icon img, .icon-box.ibox-border .ibox-icon i,.icon-box.ibox-border .ibox-icon img, address strong, ul.checks > li > i, ul.angles > li > i, ul.carets > li > i, ul.chevrons > li > i, ul.icons > li > i, .widget li .meta-data a:hover, .sort-source li.active a, .dd-menu > li > a:hover, #info-content:before, .flex-caption-text a.ico:hover, .featured-block-info .subtitle, .grid-item h4 a:hover, a:hover, .social-icons a:hover, .icon-block, .header-style3 #info-content > li i, ol.breadcrumb a, .arrow-upwards, .pages-sub-menu li.active .fa-angle-right, #service-blocks .accordion-body a:hover, .blog-list-item h4 a:hover, .blog-list-item .meta-data, .blog-grid-item .meta-data, .blog-list-item .meta-data a, .widget a:hover, .single-post .blog-grid-item .meta-data a, blockquote:before, .next-prev-post a:hover h5, .btn-primary.btn-ghost{
	color:var(--accent-color);
}
p.drop-caps.secondary:first-child:first-letter, .accent-bg, .btn-primary,
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active,
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus,
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus,
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
.label-primary,
.progress-bar-primary,
a.list-group-item.active,
a.list-group-item.active:hover,
a.list-group-item.active:focus,
.panel-primary > .panel-heading, .carousel-indicators .active, .flex-control-nav a:hover, .flex-control-nav a.flex-active, .media-box .media-box-wrapper, .icon-box.icon-box-style1:hover .ico, .ibox-effect.ibox-dark .ibox-icon i:hover,.ibox-effect.ibox-dark:hover .ibox-icon i,.ibox-border.ibox-effect.ibox-dark .ibox-icon i:after, .icon-box .ibox-icon i,.icon-box .ibox-icon img, .icon-box .ibox-icon i,.icon-box .ibox-icon img, .icon-box.ibox-dark.ibox-outline:hover .ibox-icon i, .pricing-column.highlight h3, #back-to-top:hover, .tagcloud a:hover, .accordion-heading .accordion-toggle.active, #info-toggle, #info-content, .notice-bar .btn:before, .featured-block-info .subtitle:before, .dd-menu > li ul, .parallax-light .subhead:before, .subhead.accent-color:before, .timeline > li > .timeline-badge, blockquote:after, .bootstrap-select.btn-group .dropdown-menu li.selected a, .event-grid-time, #menu-toggle:hover{
  background-color: var(--primary-color);
}
@media only screen and (max-width: 992px) {
	.header-style3 #info-content{
  		background-color: var(--primary-color);
	}
}
.btn-primary.btn-ghost:hover{
  background-color: var(--primary-color)!important;
  border-color:var(--primary-color)!important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary{
  background: var(--primary-color);
  opacity:.9
}
.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus,
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active,
a.list-group-item.active,
a.list-group-item.active:hover,
a.list-group-item.active:focus,
.panel-primary,
.panel-primary > .panel-heading, .btn-primary.btn-transparent, .icon-box.icon-box-style1 .ico, .icon-box-inline span, .icon-box.ibox-border .ibox-icon, .icon-box.ibox-outline .ibox-icon, .icon-box.ibox-dark.ibox-outline:hover .ibox-icon, .owl-theme .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span, .tagcloud a:hover, .notice-bar .flexslider, .btn-primary.btn-ghost{
	border-color:var(--primary-color);
}
.panel-primary > .panel-heading + .panel-collapse .panel-body, .pages-sub-menu li.active a, .pages-sub-menu li:hover a{
	border-top-color:var(--primary-color);
}
.panel-primary > .panel-footer + .panel-collapse .panel-body, .template-submenu li.active a, .blog-list-item .meta-data, .blog-grid-item .meta-data, .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus{
	border-bottom-color:var(--primary-color);
}
.widgettitle{
	border-left-color:var(--primary-color);
}
.ibox-border.ibox-effect.ibox-dark .ibox-icon i:hover,.ibox-border.ibox-effect.ibox-dark:hover .ibox-icon i {
	box-shadow:0 0 0 1px var(--primary-color);
}
.ibox-effect.ibox-dark .ibox-icon i:after {
	box-shadow:0 0 0 2px var(--primary-color);
}
.overlay-accent{
	background-color:var(--primary-color);
}

/* ------------------------------------------------------------------
   5. ESPRESSO & PARCHMENT THEME OVERRIDES
   ------------------------------------------------------------------ */
/* Off-white page background + espresso body text (custom.css leaves body
   with no explicit background/color of its own beyond #333). */
body {
    background: var(--light);
    color: var(--dark);
}

/* Footer: Deep Espresso grounding with crisp warm-parchment text and caramel gold accents */
.site-footer {
    background: var(--color-dark);
    color: rgba(250, 247, 242, 0.88);
    padding: 48px 0 24px;
}
.site-footer .widget {
    margin-bottom: 24px;
}
.site-footer .widget h4 {
    font-family: var(--font-heading);
    color: var(--color-accent);
    font-size: 20px;
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 18px;
    position: relative;
    padding-bottom: 10px;
    letter-spacing: 0.02em;
}
.site-footer .widget h4::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 36px;
    height: 2px;
    background: var(--color-accent);
}
.site-footer p {
    color: rgba(250, 247, 242, 0.82);
    font-size: 14px;
    line-height: 1.65;
}
.site-footer a {
    color: var(--color-accent);
    text-decoration: none;
    transition: color 0.2s ease;
}
.site-footer a:hover {
    color: var(--color-white);
    text-decoration: underline;
}
.site-footer ul.list-carets {
    padding-left: 0;
    list-style: none;
    margin-bottom: 0;
}
.site-footer ul.list-carets li {
    position: relative;
    padding-left: 0;
    margin-bottom: 9px;
    font-size: 14px;
    line-height: 1.45;
    display: flex;
    align-items: flex-start;
}
.site-footer ul.list-carets li::before {
    content: "›";
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    color: var(--color-accent, #C48F41);
    margin-right: 9px;
    margin-top: 0px;
    flex-shrink: 0;
    position: static;
    transition: transform 0.2s ease, color 0.2s ease;
}
.site-footer ul.list-carets li:hover::before {
    transform: translateX(3px);
    color: var(--color-white, #ffffff);
}
.site-footer ul.list-carets li a {
    color: rgba(250, 247, 242, 0.85);
    text-decoration: none;
    transition: color 0.2s ease;
    display: inline-block;
    width: auto;
}
.site-footer ul.list-carets li a:hover {
    color: var(--color-accent, #C48F41);
    text-decoration: none;
}
.copyright {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid rgba(229, 220, 200, 0.15);
    color: rgba(250, 247, 242, 0.70);
    font-size: 13px;
}
.copyright a {
    color: var(--color-accent);
    text-decoration: none;
}
.copyright a:hover {
    color: var(--color-white);
    text-decoration: underline;
}

/* Footer Mobile & Responsive Polish */
@media (max-width: 767px) {
    .site-footer {
        padding: 38px 0 24px;
        text-align: left;
    }
    .site-footer .widget {
        margin-bottom: 28px;
    }
    .site-footer .widget h4 {
        font-size: 19px;
        margin-bottom: 14px;
        padding-bottom: 8px;
    }
    .site-footer .col-md-3,
    .site-footer .col-md-4,
    .site-footer .col-sm-6,
    .site-footer .col-xs-6 {
        width: 100% !important;
        float: none !important;
        clear: both;
    }
    .site-footer ul.list-carets li {
        padding-left: 18px;
        margin-bottom: 9px;
        font-size: 14px;
        line-height: 1.45;
    }
    .copyright {
        margin-top: 15px;
        padding-top: 18px;
        text-align: center;
    }
    .copyright .row > div {
        text-align: center !important;
        float: none !important;
        width: 100% !important;
    }
    .copyright .text-left,
    .copyright .text-right {
        text-align: center !important;
    }
    .copyright p {
        margin-bottom: 8px;
        font-size: 12.5px;
        line-height: 1.6;
    }
}

/* Loader: was a light ring on a dark screen; the screen is now light tan. */
.loader-spinner {
    border: 3px solid rgba(44, 26, 14, 0.15);
}

/* Buttons: hardcoded shadow tints keyed to the old --primary-color rgb. */
.btn-primary {
    box-shadow: 0 10px 30px rgba(139, 90, 43, 0.35);
}
.btn-primary:hover {
    box-shadow: 0 15px 40px rgba(139, 90, 43, 0.45);
}

/* Content block heading underline (old accent-color rgba). */
.content-block h3 {
    border-bottom: 2px solid rgba(107, 66, 38, 0.25);
}

/* Highlight box: flatten the gradient, no gradients anywhere. Two
   definitions exist in custom.css (lines ~694 and ~1036); this single
   override, appearing after both in the cascade, replaces both. */
.highlight-box {
    background: rgba(139, 90, 43, 0.08);
}

/* Timeline dot glow + contact form field focus rings (old accent rgba). */
.timeline-item::before {
    box-shadow: 0 0 0 4px rgba(107, 66, 38, 0.2);
}
.contact-form .form-control {
    border: 2px solid rgba(107, 66, 38, 0.25);
}
.contact-form .form-control:focus {
    box-shadow: 0 0 0 3px rgba(107, 66, 38, 0.15);
}

/* Page header photo overlay: flatten the diagonal 3-stop gradient into a
   single translucent espresso wash, dark enough to keep the white h1/lead
   legible over the photo. */
.page-header-photo::before {
    background: rgba(44, 26, 14, 0.62);
}

/* Photo figures / portrait card / press / video meta: neutral greys had a
   faint lavender cast -- warm them to match the brown palette. */
.photo-figure figcaption,
.portrait-card .portrait-role,
.publication-item .pub-meta,
.quote-card cite,
.video-meta p {
    color: var(--text-muted);
}
.press-date,
.chapter-nav .cn-label,
.contact-details .cd-label,
.source-note {
    color: var(--text-subtle);
}
.photo-figure,
.milestone-box,
.cv-table thead th,
.chapter-nav a {
    background: var(--surface-warm);
}
.publication-item,
.milestone-box,
.section-title,
.cv-table td,
.timeline-simple,
.chapter-nav,
.chapter-nav a,
.source-note {
    border-color: var(--border-color);
}
.video-thumb {
    background: var(--surface-muted);
}

/* Publication "cited" chip: old gold rgba background. */
.publication-item .pub-cited {
    background: rgba(196, 143, 65, 0.18);
}

/* Video play button: hardcoded hex + shadow tints, independent of the
   --gold / --accent-color / --dark variables. */
.video-play {
    background: var(--accent-color);
    box-shadow: 0 8px 24px rgba(107, 66, 38, 0.5);
}
.video-card:hover .video-play {
    background: var(--gold);
    color: var(--dark);
    box-shadow: 0 10px 30px rgba(196, 143, 65, 0.5);
}
.video-card:hover {
    box-shadow: 0 18px 40px rgba(44, 26, 14, 0.16), 0 0 20px rgba(139, 90, 43, 0.15);
}
.press-item:hover,
.publication-item:hover,
.photo-figure,
.portrait-card,
.chapter-nav a:hover {
    box-shadow: 0 14px 32px rgba(44, 26, 14, 0.12);
}
.video-card {
    box-shadow: 0 12px 30px rgba(44, 26, 14, 0.1);
}

/* Timeline (simple) dot glow + contact detail icon chip (old accent rgba). */
.timeline-simple > li::before {
    box-shadow: 0 0 0 4px rgba(107, 66, 38, 0.18);
}
.contact-details li i {
    background: rgba(107, 66, 38, 0.12);
}

/* Form notice banner: old gold rgba background/border. */
.form-notice {
    background: rgba(196, 143, 65, 0.12);
    border: 1px solid rgba(196, 143, 65, 0.4);
}

/* ==================================================================
   COLLABORATION & ADVISORY SECTION (4-PILLAR GRID & CTA)
   Strictly using CSS variables from color1.css
   ================================================================== */
.collab-section {
    padding: 36px 0 20px;
}
.collab-section-header {
    text-align: center;
    margin-bottom: 26px;
}
.collab-eyebrow {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-primary);
    display: inline-block;
    margin-bottom: 6px;
}
.collab-title {
    font-family: var(--font-heading);
    font-size: 32px;
    font-weight: 700;
    color: var(--color-dark);
    margin: 0 0 8px;
    line-height: 1.2;
}
.collab-lead {
    font-size: 15.5px;
    color: var(--text-muted);
    max-width: 680px;
    margin: 0 auto;
    line-height: 1.55;
}

.collab-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px 20px;
}
.collab-card-col {
    padding: 0 10px;
    margin-bottom: 20px;
}
.collab-card {
    background: var(--surface-white);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    padding: 20px 20px 16px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.22s ease;
    text-decoration: none !important;
    box-shadow: 0 2px 8px rgba(44, 26, 14, 0.04);
}
.collab-card:hover {
    border-color: var(--color-primary);
    box-shadow: 0 8px 24px rgba(44, 26, 14, 0.09);
    transform: translateY(-2px);
}
.collab-card-top {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 10px;
}
.collab-icon-box {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: var(--surface-warm);
    border: 1px solid var(--border-color);
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
    transition: all 0.22s ease;
}
.collab-card:hover .collab-icon-box {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}
.collab-card-heading {
    font-family: var(--font-heading);
    font-size: 19px;
    font-weight: 700;
    color: var(--color-dark);
    margin: 0 0 2px;
    line-height: 1.25;
}
.collab-card-tag {
    font-size: 11px;
    font-weight: 600;
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: block;
}
.collab-card-desc {
    font-size: 13.5px;
    color: var(--text-muted);
    line-height: 1.5;
    margin-bottom: 12px;
}
.collab-card-action {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: gap 0.2s ease;
}
.collab-card:hover .collab-card-action {
    gap: 10px;
    color: var(--primary-dark);
}

/* Bottom CTA Banner */
.collab-cta-box {
    background: var(--surface-white);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    box-shadow: 0 3px 14px rgba(44, 26, 14, 0.05);
    margin-bottom: 24px;
}
.collab-cta-text h3 {
    font-family: var(--font-heading);
    font-size: 21px;
    font-weight: 700;
    color: var(--color-dark);
    margin: 0 0 3px;
}
.collab-cta-text p {
    font-size: 13.5px;
    color: var(--text-muted);
    margin: 0;
}
.collab-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 22px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: var(--color-primary);
    color: var(--color-white) !important;
    border: 1px solid var(--primary-dark);
    border-radius: 6px;
    text-decoration: none !important;
    box-shadow: 0 3px 10px rgba(138, 86, 43, 0.22);
    transition: all 0.2s ease;
}
.collab-cta-btn:hover {
    background: var(--primary-dark);
    box-shadow: 0 5px 16px rgba(138, 86, 43, 0.32);
    transform: translateY(-1px);
}

/* ==================================================================
   STAY INFORMED CARD: ICON & INPUT ALIGNMENT
   ================================================================== */
.informed-format-icon {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background: var(--surface-warm);
    border: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-primary);
    font-size: 14px;
    flex-shrink: 0;
}
.informed-input-wrap {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}
.informed-field-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    margin-top: -7px;
    height: 14px;
    line-height: 14px;
    color: var(--color-primary);
    font-size: 13.5px;
    pointer-events: none;
    z-index: 3;
    display: block;
}
.informed-input {
    background: var(--surface-warm) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 4px !important;
    height: 38px !important;
    line-height: 24px !important;
    padding: 6px 12px 6px 36px !important;
    font-size: 12.5px !important;
    color: var(--dark) !important;
    box-shadow: none !important;
    width: 100% !important;
    margin: 0 !important;
}
.informed-input:focus {
    border-color: var(--color-primary) !important;
    background: var(--surface-white) !important;
    box-shadow: 0 0 0 2px rgba(139, 90, 43, 0.15) !important;
}

/* ==================================================================
   NOTICE BAR: SCHOLARLY QUOTE & "IN THE EYES OF DR. BANERJEE" (RESPONSIVE)
   Strictly using CSS variables from color1.css
   ================================================================== */
.notice-bar {
    background: var(--color-dark) !important;
    border-top: 1px solid rgba(229, 220, 200, 0.15) !important;
    border-bottom: 1px solid rgba(229, 220, 200, 0.15) !important;
    padding: 16px 0 !important;
    position: relative;
    z-index: 5;
    min-height: auto !important;
    overflow: visible !important;
}
.notice-bar-grid {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
}
.notice-bar-quote-col {
    flex: 1 1 560px;
    min-width: 0;
}
.notice-bar-inner {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
}
.notice-bar .icon-block {
    width: 44px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    font-size: 18px;
    background-color: rgba(196, 143, 65, 0.15) !important;
    border: 1px solid var(--color-accent) !important;
    color: var(--color-accent) !important;
    border-radius: 8px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 2px 0 0 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}
.notice-bar .icon-block i {
    color: var(--color-accent) !important;
    line-height: 1;
}
.notice-content {
    flex: 1;
    min-width: 0;
}
.notice-quote-text {
    margin: 0 0 6px 0 !important;
    font-family: var(--font-quote) !important;
    font-size: 16.5px !important;
    font-style: italic !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;
    color: var(--color-white) !important;
    letter-spacing: 0.2px !important;
}
.notice-quote-author {
    display: block !important;
    font-family: var(--font-body) !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: var(--color-accent) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    line-height: 1.3 !important;
}
.notice-quote-affil {
    color: var(--color-border) !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* Feature CTA Card */
.notice-bar-cta-col {
    flex: 0 0 auto;
    width: auto;
    min-width: 290px;
}
.notice-feature-card {
    background: var(--primary-color);
    border: 1px solid var(--primary-dark);
    border-radius: 6px;
    padding: 12px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    text-decoration: none !important;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.25);
    transition: all 0.22s ease;
    width: 100%;
}
.notice-feature-card:hover {
    background: var(--primary-dark);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
    transform: translateY(-1px);
}
.notice-feature-text {
    display: flex;
    flex-direction: column;
}
.notice-feature-title {
    font-family: var(--font-heading);
    font-size: 18px;
    font-weight: 700;
    color: var(--color-white);
    line-height: 1.2;
}
.notice-feature-sub {
    font-family: var(--font-body);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.9);
    margin-top: 2px;
}
.notice-feature-arrow {
    font-size: 24px;
    color: var(--color-white);
    line-height: 1;
    display: flex;
    align-items: center;
    transition: transform 0.2s ease;
}
.notice-feature-card:hover .notice-feature-arrow {
    transform: translateX(3px);
}

@media (max-width: 991px) {
    .notice-bar-grid {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }
    .notice-bar-quote-col,
    .notice-bar-cta-col {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
    }
    .notice-quote-text {
        font-size: 15px !important;
    }
}
@media (max-width: 480px) {
    .notice-bar-inner {
        gap: 12px;
    }
    .notice-bar .icon-block {
        width: 38px;
        height: 38px;
        font-size: 15px;
    }
    .notice-feature-card {
        padding: 10px 14px;
    }
    .notice-feature-title {
        font-size: 16.5px;
    }
}

/* ==================================================================
   TOPBAR DESIGNATION ROTATOR (5s Cycle with smooth fade)
   ================================================================== */
.topbar-rotator {
    position: relative;
    height: 24px;
    line-height: 24px;
    overflow: hidden;
    margin: 0;
    width: 100%;
    max-width: 100%;
}
.topbar-rotator-item {
    display: none;
    opacity: 0;
    font-size: 13px;
    font-weight: 600;
    color: #ffffff;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 100%;
}
.topbar-rotator-item.active {
    display: block !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    opacity: 1;
    color: #ffffff;
}
.topbar-rotator-item i {
    color: #ffffff;
    font-size: 12px;
    margin-right: 6px;
    vertical-align: baseline;
}
@media (max-width: 767px) {
    .topbar {
        padding: 6px 0 !important;
        text-align: center;
    }
    .topbar .social-icons {
        display: none !important;
    }
    .topbar .col-md-7,
    .topbar .col-sm-8,
    .topbar .col-xs-12 {
        width: 100% !important;
        float: none !important;
        text-align: center !important;
        padding: 0 10px !important;
    }
    .topbar-rotator {
        text-align: center;
        height: 22px;
        line-height: 22px;
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }
    .topbar-rotator-item {
        font-size: 11.5px;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        line-height: 22px;
        color: #ffffff;
        max-width: 100%;
    }
    .topbar-rotator-item.active {
        display: block !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        width: 100%;
    }
}

/* ==================================================================
   MOBILE MENU TOGGLE (Modern Minimalist 3-Line Hamburger & Close)
   ================================================================== */
#menu-toggle {
    display: none;
}
@media only screen and (max-width: 991px) {
    #menu-toggle {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        line-height: 42px;
        padding: 0 !important;
        background: transparent !important;
        color: var(--primary-color, #8b5a2b) !important;
        border: none !important;
        border-radius: 0 !important;
        font-size: 24px;
        text-align: center;
        text-decoration: none !important;
        box-shadow: none !important;
        transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease;
        cursor: pointer;
        margin: 0 !important;
        float: none !important;
        flex-shrink: 0;
        outline: none !important;
    }
    #menu-toggle:hover,
    #menu-toggle:focus {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        color: #6a3a14 !important;
        opacity: 0.85;
    }
    #menu-toggle.opened {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        color: var(--primary-color, #8b5a2b) !important;
    }
    #menu-toggle i {
        font-size: 24px;
        color: inherit !important;
        line-height: 1;
        transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    }
    #menu-toggle.opened i {
        transform: rotate(90deg);
        font-size: 26px;
    }
    #menu-toggle.opened i.fa-bars:before {
        content: "\f00d"; /* FontAwesome fa-times (X) */
    }
}







