.elementor-kit-7{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-size:88px;--e-global-typography-primary-font-weight:800;--e-global-typography-primary-letter-spacing:-0.5px;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-size:32px;--e-global-typography-secondary-font-weight:700;--e-global-typography-secondary-line-height:1.2em;--e-global-typography-secondary-letter-spacing:0px;--e-global-typography-text-font-family:"Poppins";--e-global-typography-text-font-size:18px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.6em;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:700;}.elementor-kit-7 button:hover,.elementor-kit-7 button:focus,.elementor-kit-7 input[type="button"]:hover,.elementor-kit-7 input[type="button"]:focus,.elementor-kit-7 input[type="submit"]:hover,.elementor-kit-7 input[type="submit"]:focus,.elementor-kit-7 .elementor-button:hover,.elementor-kit-7 .elementor-button:focus{background-color:#FF6F00;color:#FFFFFF;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-kit-7 button,.elementor-kit-7 input[type="button"],.elementor-kit-7 input[type="submit"],.elementor-kit-7 .elementor-button{font-family:"Poppins", Sans-serif;font-size:16px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:#FFFFFF;border-style:solid;border-width:0px 0px 0px 0px;border-radius:6px 6px 6px 6px;padding:14px 28px 14px 28px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-7{--e-global-typography-primary-font-size:56px;--e-global-typography-secondary-font-size:28px;--e-global-typography-text-font-size:16px;--e-global-typography-accent-font-size:16px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-7{--e-global-typography-primary-font-size:36px;--e-global-typography-secondary-font-size:24px;--e-global-typography-text-font-size:14px;--e-global-typography-accent-font-size:15px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ------------------------------
  Teachers of India Foundation
  Global UI CSS — Inspired by ShikshaRatan style
  Paste into: Elementor → Site Settings → Custom CSS
  Or: Appearance → Customize → Additional CSS (or child theme style.css)
------------------------------ */

/* Google fonts (if your theme/Elementor already loads fonts, remove this import) */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Noto+Sans+Devanagari:wght@400;600;700&display=swap');

/* ---------------- Variables ---------------- */
:root{
  --primary: #1A73E8;    /* blue */
  --secondary:#FF6F00;   /* orange */
  --text: #212121;       /* dark text */
  --accent: #34A853;     /* green */
  --gold: #F9A825;       /* gold */
  --bg: #FFFFFF;
  --muted: #757575;
  --card-shadow: 0 8px 28px rgba(23,27,30,0.06);
  --radius: 8px;
}

/* ---------------- Base / Typography ---------------- */
html,body {
  font-family: "Poppins", "Noto Sans Devanagari", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color: var(--text);
  background-color: var(--bg);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.6;
  -webkit-text-size-adjust:100%;
}

/* default paragraph spacing */
p { margin: 0 0 1rem 0; }

/* links */
a { color: var(--primary); transition: color .18s ease, opacity .18s ease; text-decoration: none; }
a:hover { color: var(--secondary); text-decoration: none; }

/* Headings (Elementor widgets usually produce .elementor-heading-title) */
.elementor-widget-heading .elementor-heading-title,
h1,h2,h3,h4,h5,h6 {
  margin:0 0 .6rem 0;
  color: var(--text);
  font-weight:600;
}

/* explicit sizes (adjust as needed in Theme Style) */
h1 { font-size: 44px; line-height:1.05; color:var(--primary); }
h2 { font-size: 34px; color:var(--secondary); }
h3 { font-size: 26px; }
h4 { font-size: 20px; color:var(--accent); }
h5 { font-size: 16px; color:var(--text); }
h6 { font-size: 14px; color:var(--muted); }

/* small muted text */
.muted { color: var(--muted); font-size:14px; }

/* ---------------- Header / Nav ---------------- */
/* target common header .elementor-kit-7s and elementor nav */
.elementor-location-header,
header.site-header,
.header-wrap {
  background: #fff;
  box-shadow: 0 2px 8px rgba(16,24,40,0.04);
  position: sticky;
  top: 0;
  z-index: 9999;
}

/* logo */
.site-logo img,
.header-logo img {
  max-height: 56px;
  width: auto;
  display:block;
}

/* nav links */
.elementor-nav-menu a,
.main-navigation a,
.header-nav a {
  color: var(--text);
  font-weight:600;
  padding: 10px 12px;
  transition: color .15s ease, background .15s ease;
}
.elementor-nav-menu a:hover,
.main-navigation a:hover { color: var(--primary); }

/* mobile menu button */
.elementor-menu-toggle { color:var(--primary) !important; }

/* ---------------- Hero Section ---------------- */
/* IMPORTANT: Give your hero section the class "hero-section" in Elementor (Advanced → CSS Classes) */
.hero-section {
  padding: 84px 0;
  background: linear-gradient(90deg, rgba(26,115,232,0.95) 0%, rgba(255,111,0,0.85) 100%);
  color:#fff;
  overflow:hidden;
}
.hero-section .elementor-heading-title { color:#fff; font-weight:700; }
.hero-section .hero-sub { font-size: 18px; margin-top: 12px; color: rgba(255,255,255,0.95); }

/* hero CTA */
.elementor-button, .btn-primary {
  background: var(--primary);
  color: #fff;
  padding: 14px 28px;
  border-radius: 6px;
  box-shadow: var(--card-shadow);
  border: none;
  font-weight:600;
  transition: background .25s ease, transform .08s ease, box-shadow .18s ease;
}
.elementor-button:hover, .btn-primary:hover {
  background: var(--secondary);
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(0,0,0,0.12);
}

/* badge style for small highlights */
.certificate-badge {
  display:inline-block;
  padding: 8px 12px;
  border-radius: 20px;
  font-weight:600;
  color:#fff;
  background: linear-gradient(90deg,var(--gold),var(--secondary));
}

/* ---------------- Feature Grid / Cards ---------------- */
/* Give the container class "feature-grid" and each item "feature-card" */
.feature-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:24px; align-items:stretch; }
@media (max-width: 991px){ .feature-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 480px){ .feature-grid{ grid-template-columns: 1fr; } }

.feature-card {
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--card-shadow);
  padding: 20px;
  text-align:center;
  transition: transform .18s ease, box-shadow .18s ease;
}
.feature-card:hover { transform: translateY(-6px); box-shadow: 0 20px 40px rgba(16,24,40,0.08); }
.feature-card img { max-width: 84px; margin-bottom:12px; display:block; margin-left:auto; margin-right:auto; }

/* ---------------- Forms (Elementor form widgets) ---------------- */
.elementor-form { background: #fff; padding: 18px; border-radius: 8px; box-shadow: var(--card-shadow); }
.elementor-field-group .elementor-field,
.elementor-form .elementor-field-type-text input,
.elementor-form textarea,
.elementor-form select {
  border: 1px solid #e6e6e6;
  padding: 12px;
  border-radius: 6px;
  width:100%;
  box-sizing:border-box;
  font-size:15px;
  color:var(--text);
}
.elementor-form .elementor-field::placeholder { color: #9e9e9e; }

/* form submit button (override) */
.elementor-form .elementor-button { background: var(--primary); color:#fff; border-radius:6px; }

/* ---------------- Images ---------------- */
.elementor-widget-image img { max-width:100%; height:auto; border-radius:8px; display:block; }

/* ---------------- Footer ---------------- */
.site-footer {
  background: #0f1724;
  color: #e6eef8;
  padding: 44px 0;
}
.site-footer a { color:#fff; text-decoration: none; opacity: .95; }
.site-footer .muted { color: rgba(255,255,255,0.7); }

/* ---------------- Tiny utilities ---------------- */
.text-center { text-align:center; }
.small { font-size:13px; color:var(--muted); }

/* sticky floating CTA (assign class "sticky-cta" to a link/button) */
.sticky-cta {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 99999;
  box-shadow: 0 14px 30px rgba(16,24,40,0.12);
}

/* subtle cards meta */
.card .meta { color: var(--muted); font-size:13px; }

/* ---------------- Accessibility tweak: focus ring ---------------- */
a:focus, button:focus, input:focus, textarea:focus {
  outline: 3px solid rgba(26,115,232,0.12);
  outline-offset: 2px;
}

/* ---------------- Responsive tweaks ---------------- */
@media (max-width: 768px){
  h1 { font-size: 32px; }
  .hero-section { padding: 48px 18px; }
  .elementor-button { padding: 12px 18px; }
}

/* ---------------- End of CSS ---------------- *//* End custom CSS */