/*
Theme Name: GeneratePress Child
Theme URI: https://getkamaikendra.com/
Description: Custom child theme for Get Kamai Kendra using GeneratePress.
Author: Tayyab Ali
Template: generatepress
Version: 1.0.0
Text Domain: generatepress-child
*/

/* Main child theme stylesheet. */
/* =========================================================
GENERATEPRESS PREMIUM HEADER
========================================================= */


/* =========================================================
GLOBAL COLORS AND VARIABLES
========================================================= */

:root {
  --kk-green: #18b965;
  --kk-green-dark: #075b36;
  --kk-green-deep: #063f2a;
  --kk-green-soft: #eafaf1;

  --kk-navy: #0f172a;
  --kk-text: #475569;
  --kk-muted: #64748b;

  --kk-border: #e2e8f0;
  --kk-background: #f8fafc;
  --kk-white: #ffffff;

  --kk-radius: 22px;
  --kk-container: 1180px;
  --kk-shadow: 0 18px 55px rgba(15, 23, 42, 0.09);
}


/* =========================================================
SHARED COMPONENTS
========================================================= */

body {
  overflow-x: hidden;
}

.kk-home,
.kk-home * {
  box-sizing: border-box;
}

.kk-home {
  color: var(--kk-text);
  background: var(--kk-white);
  font-family:
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  font-size: 16px;
  line-height: 1.7;
}

.kk-container {
  width: min(calc(100% - 40px), var(--kk-container));
  margin-inline: auto;
}

.kk-section {
  padding: 84px 0;
}

.kk-section--light {
  background: var(--kk-background);
}

.kk-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  color: var(--kk-green);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.kk-kicker::before {
  width: 24px;
  height: 2px;
  content: "";
  background: currentColor;
}

.kk-heading {
  max-width: 760px;
  margin: 0 auto 44px;
  text-align: center;
}

.kk-heading h2 {
  margin: 0 0 12px;
  color: var(--kk-navy);
  font-size: clamp(30px, 4vw, 44px);
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.kk-heading p {
  margin: 0;
  color: var(--kk-muted);
  font-size: 17px;
}


/* =========================================================
BUTTONS
========================================================= */

.kk-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 52px;
  padding: 13px 24px;
  border: 1px solid transparent;
  border-radius: 12px;
  font-weight: 800;
  text-decoration: none;
  transition:
    transform 0.18s ease,
    background-color 0.18s ease;
}

.kk-button:hover {
  transform: translateY(-2px);
}

.kk-button--primary {
  color: var(--kk-white) !important;
  background: var(--kk-green);
}

.kk-button--primary:hover {
  background: var(--kk-green-dark);
}

.kk-button--outline {
  color: var(--kk-white) !important;
  border-color: rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.08);
}

.kk-button--light {
  color: var(--kk-green-dark) !important;
  background: var(--kk-white);
}

.kk-icon {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}


/* =========================================================
RESPONSIVE
========================================================= */

@media (max-width: 700px) {
  .kk-container {
    width: min(calc(100% - 26px), var(--kk-container));
  }

  .kk-section {
    padding: 58px 0;
  }
}

/* Whole header area */
.site-header {
  position: relative;
  z-index: 100;
  border-bottom: 1px solid rgba(15, 23, 42, 0.07);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 6px 25px rgba(15, 23, 42, 0.05);
}

/* Keep inner content aligned with site sections */
.site-header .inside-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 78px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 12px 20px;
}

/* Site branding */
.site-branding {
  display: flex;
  align-items: center;
}

.site-branding-container {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Logo image */
.site-logo img {
  display: block;
  width: auto;
  max-height: 46px;
}

/* Text title */
.main-title {
  margin: 0;
  font-size: 20px;
  line-height: 1.15;
}

.main-title a {
  color: #075b36;
  font-weight: 800;
  text-decoration: none;
}

/* Optional tagline */
.site-description {
  margin-top: 3px;
  color: #6b7f75;
  font-size: 12px;
}

/* =========================================================
PRIMARY NAVIGATION
========================================================= */

.main-navigation {
  width: auto;
  background: transparent;
}

.main-navigation .inside-navigation {
  max-width: none;
  padding: 0;
}

.main-navigation .main-nav > ul {
  display: flex;
  align-items: center;
  gap: 4px;
}

.main-navigation .main-nav > ul > li > a {
  position: relative;
  padding: 13px 15px;
  color: #334155;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  transition:
    color 0.18s ease,
    background-color 0.18s ease;
}

/* Underline hover */
.main-navigation .main-nav > ul > li:not(.kk-nav-download) > a::after {
  position: absolute;
  right: 15px;
  bottom: 7px;
  left: 15px;
  height: 2px;
  content: "";
  background: #18b965;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.18s ease;
}

.main-navigation .main-nav > ul > li:not(.kk-nav-download) > a:hover::after,
.main-navigation .main-nav > ul > li.current-menu-item:not(.kk-nav-download) > a::after {
  transform: scaleX(1);
}

.main-navigation .main-nav > ul > li > a:hover,
.main-navigation .main-nav > ul > li.current-menu-item > a {
  color: #075b36;
  background: transparent;
}

/* =========================================================
DOWNLOAD BUTTON IN MENU
Add class kk-nav-download to the menu item
========================================================= */

.main-navigation .main-nav > ul > li.kk-nav-download {
  margin-left: 8px;
}

.main-navigation .main-nav > ul > li.kk-nav-download > a {
  min-height: 44px;
  padding: 13px 20px;
  border-radius: 11px;
  color: #ffffff;
  background: linear-gradient(135deg, #18b965, #0d8d49);
  box-shadow: 0 10px 24px rgba(24, 185, 101, 0.22);
}

.main-navigation .main-nav > ul > li.kk-nav-download > a:hover {
  color: #ffffff;
  background: linear-gradient(135deg, #0fa956, #087844);
  transform: translateY(-1px);
}

/* =========================================================
STICKY HEADER
Lightweight CSS-only sticky effect
========================================================= */

.site-header {
  position: sticky;
  top: 0;
}

/* Admin bar offset */
.admin-bar .site-header {
  top: 32px;
}

/* =========================================================
DROPDOWNS
========================================================= */

.main-navigation ul ul {
  min-width: 210px;
  padding: 8px;
  border: 1px solid #e2e8f0;
  border-radius: 13px;
  background: #ffffff;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
}

.main-navigation ul ul li a {
  padding: 11px 13px;
  border-radius: 8px;
  color: #475569;
  font-size: 14px;
}

.main-navigation ul ul li a:hover {
  color: #075b36;
  background: #eafaf1;
}

/* =========================================================
MOBILE MENU
========================================================= */

.menu-toggle {
  border: 1px solid #dbe5df;
  border-radius: 10px;
  color: #075b36;
  background: #f4fbf7;
}

.menu-toggle:hover,
.menu-toggle:focus {
  color: #ffffff;
  background: #18b965;
}
/* =========================================================
GENERATEPRESS MOBILE HEADER — FINAL FIX
========================================================= */

@media (max-width: 768px) {

  /* Header container */
  .site-header {
    position: sticky;
    top: 0;
    z-index: 9999;
    width: 100%;
    border-bottom: 1px solid rgba(15, 23, 42, 0.08);
    background: #ffffff;
    box-shadow: 0 6px 22px rgba(15, 23, 42, 0.08);
  }

  /* First row: title left, hamburger right */
  .site-header.has-inline-mobile-toggle .inside-header,
  .site-header .inside-header {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 46px;
    align-items: center;
    gap: 12px;

    width: 100%;
    min-height: 68px;
    margin: 0 auto;
    padding: 10px 16px;
  }

  /* Branding */
  .site-header .site-branding {
    display: block;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
  }

  .site-header .main-title {
    margin: 0 !important;
    font-size: 17px !important;
    line-height: 1.2;
  }

  .site-header .main-title a {
    display: block;
    overflow: hidden;
    color: #075b36;
    font-weight: 800;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .site-header .site-description {
    display: none;
  }

  /* Mobile toggle wrapper */
  #mobile-menu-control-wrapper,
  .main-navigation.mobile-menu-control-wrapper {
    display: block !important;
    grid-column: 2;
    width: 46px !important;
    min-width: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  #mobile-menu-control-wrapper .inside-navigation {
    display: block !important;
    width: 46px;
    margin: 0;
    padding: 0 !important;
  }

  /* Hamburger button */
  #mobile-menu-control-wrapper .menu-toggle {
    display: grid !important;
    place-items: center;

    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 1px solid #d7e8de;
    border-radius: 12px;

    color: #087147;
    background: #eefaf3;
    line-height: 1;
  }

  #mobile-menu-control-wrapper .menu-toggle:hover,
  #mobile-menu-control-wrapper .menu-toggle:focus,
  #mobile-menu-control-wrapper .menu-toggle[aria-expanded="true"] {
    color: #ffffff;
    border-color: #18b965;
    background: #18b965;
  }

  #mobile-menu-control-wrapper .menu-toggle .gp-icon {
    display: grid;
    place-items: center;
    margin: 0 !important;
  }

  #mobile-menu-control-wrapper .menu-toggle svg {
    width: 21px;
    height: 21px;
  }

  /* Actual navigation stays below the header row */
  #site-navigation {
    position: relative;
    z-index: 9998;
    width: 100% !important;
    margin: 0 !important;
    padding: 0;
    background: #ffffff;
  }

  /* Closed menu */
  #site-navigation:not(.toggled) .main-nav {
    display: none;
  }

  /* Open menu */
  #site-navigation.toggled {
    padding: 0 14px 14px;
  }

  #site-navigation.toggled .main-nav {
    display: block !important;
    overflow: hidden;
    width: 100%;
    margin: 0;
    padding: 10px;

    border: 1px solid #e2e8f0;
    border-radius: 15px;

    background: #ffffff;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.14);
  }

  #site-navigation.toggled .main-nav > ul {
    display: flex !important;
    flex-direction: column;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
  }

  #site-navigation.toggled .main-nav > ul > li {
    display: block;
    width: 100%;
    margin: 0 0 4px;
  }

  #site-navigation.toggled .main-nav > ul > li:last-child {
    margin-bottom: 0;
  }

  #site-navigation.toggled .main-nav > ul > li > a {
    display: flex;
    align-items: center;
    justify-content: flex-start;

    width: 100%;
    min-height: 46px;
    padding: 12px 14px;

    border-radius: 10px;

    color: #334155;
    font-size: 15px;
    font-weight: 700;
    text-align: left;
  }

  #site-navigation.toggled .main-nav > ul > li > a::after {
    display: none !important;
  }

  #site-navigation.toggled .main-nav > ul > li > a:hover,
  #site-navigation.toggled .main-nav > ul > li.current-menu-item > a {
    color: #075b36;
    background: #eafaf1;
  }

  /* Download button */
  #site-navigation.toggled .main-nav > ul > li.kk-nav-download {
    margin-top: 7px;
  }

  #site-navigation.toggled .main-nav > ul > li.kk-nav-download > a {
    justify-content: center;
    color: #ffffff !important;
    background: linear-gradient(135deg, #18b965, #0d8d49);
    box-shadow: 0 9px 22px rgba(24, 185, 101, 0.2);
  }
}


/* WordPress admin-bar offset */
@media (max-width: 782px) {
  .admin-bar .site-header {
    top: 46px;
  }
}
.site-info {
  display: none !important;
}



/* =========================================================
GENERATEPRESS RESPONSIVE FOOTER
========================================================= */

.site-footer {
  margin: 0 !important;
  padding: 0 !important;
}

.footer-widgets {
  width: 100%;
  margin: 0;
  padding: 68px 0 54px;
  color: #9eb8ac;
  background:
    radial-gradient(
      circle at 85% 15%,
      rgba(24, 185, 101, 0.08),
      transparent 28%
    ),
    #041d15;
}

.footer-widgets .inside-footer-widgets {
  display: grid !important;
  grid-template-columns:
    minmax(260px, 1.45fr)
    repeat(3, minmax(150px, 1fr));
  align-items: start;
  gap: 48px;
  width: min(calc(100% - 40px), 1280px);
  margin: 0 auto;
  padding: 0;
}

.footer-widget-1,
.footer-widget-2,
.footer-widget-3,
.footer-widget-4 {
  width: auto !important;
  min-width: 0;
  margin: 0 !important;
  padding: 0 !important;
}

.footer-widgets .widget {
  margin: 0 !important;
  padding: 0 !important;
}


/* =========================================================
FOOTER WIDGET HEADINGS
========================================================= */

.footer-widgets .widget-title {
  position: relative;
  display: block;
  margin: 0 0 22px !important;
  padding: 0 0 12px !important;
  color: #ffffff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.footer-widgets .widget-title::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 36px;
  height: 2px;
  content: "";
  border-radius: 4px;
  background: #18b965;
}


/* =========================================================
FOOTER BRAND
========================================================= */

.kk-footer-brand {
  max-width: 380px;
}

.kk-footer-logo {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  color: #ffffff !important;
  text-decoration: none !important;
}

.kk-footer-logo-icon {
  display: grid;
  place-items: center;
  width: 52px;
  min-width: 52px;
  height: 52px;
  border-radius: 15px;
  color: #ffffff;
  background: linear-gradient(135deg, #18b965, #087147);
  box-shadow: 0 12px 30px rgba(24, 185, 101, 0.18);
}

.kk-footer-logo-icon svg {
  width: 27px;
  height: 27px;
}

.kk-footer-logo strong {
  display: block;
  color: #ffffff;
  font-size: 18px;
  line-height: 1.25;
}

.kk-footer-logo small {
  display: block;
  margin-top: 3px;
  color: #72c995;
  font-size: 12px;
}

.kk-footer-brand p {
  margin: 22px 0 0;
  color: #9eb8ac;
  font-size: 14px;
  line-height: 1.85;
}


/* =========================================================
FOOTER LINKS
========================================================= */

.kk-footer-links {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.kk-footer-links li {
  margin: 0 0 12px !important;
  padding: 0 !important;
}

/* Strong selectors override GeneratePress blue links */
.footer-widgets .widget .kk-footer-links a,
.footer-widgets .widget .kk-footer-links a:visited,
.footer-widgets .widget .kk-footer-links a:active {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding-left: 16px;
  color: #9eb8ac !important;
  font-size: 14px;
  line-height: 1.5;
  text-decoration: none !important;
  transition:
    color 0.18s ease,
    transform 0.18s ease;
}

.footer-widgets .widget .kk-footer-links a::before {
  position: absolute;
  left: 0;
  width: 5px;
  height: 5px;
  content: "";
  border-radius: 50%;
  background: #18b965;
}

.footer-widgets .widget .kk-footer-links a:hover,
.footer-widgets .widget .kk-footer-links a:focus {
  color: #ffffff !important;
  transform: translateX(4px);
}


/* =========================================================
SOCIAL ICONS
========================================================= */

.kk-social-icons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 15px;
}

.footer-widgets .kk-social-icons a,
.footer-widgets .kk-social-icons a:visited {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  padding: 0;
  border-radius: 12px;
  color: #ffffff !important;
  background: #0d8d49;
  text-decoration: none !important;
  transition:
    background-color 0.18s ease,
    transform 0.18s ease;
}

.footer-widgets .kk-social-icons a:hover {
  color: #ffffff !important;
  background: #18b965;
  transform: translateY(-3px);
}

.kk-social-icons svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}


/* =========================================================
REMOVE DEFAULT GENERATEPRESS FOOTER BAR
========================================================= */

.site-info,
.site-info .inside-site-info,
.site-info .copyright-bar,
.footer-bar,
.kk-footer-bar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}


/* =========================================================
TABLET
========================================================= */

@media (max-width: 980px) {
  .footer-widgets .inside-footer-widgets {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 42px 36px;
  }

  .footer-widget-1 {
    grid-column: span 2;
  }

  .kk-footer-brand {
    max-width: 600px;
  }
}


/* =========================================================
MOBILE
========================================================= */

@media (max-width: 650px) {
  .footer-widgets {
    margin-bottom: 0 !important;
    padding: 48px 0 32px;
  }

  .footer-widgets .inside-footer-widgets {
    grid-template-columns: 1fr;
    gap: 34px;
    width: min(calc(100% - 28px), 1280px);
    margin-bottom: 0 !important;
  }

  .footer-widget-1 {
    grid-column: auto;
  }

  .kk-footer-brand {
    max-width: none;
  }

  .footer-widgets .widget-title {
    margin-bottom: 18px !important;
    font-size: 17px !important;
  }

  .kk-footer-logo {
    align-items: flex-start;
  }

  .footer-widgets .widget .kk-footer-links a {
    overflow-wrap: anywhere;
  }
}


/* =========================================================
SMALL MOBILE
========================================================= */

@media (max-width: 400px) {
  .footer-widgets .inside-footer-widgets {
    width: min(calc(100% - 22px), 1280px);
  }

  .kk-footer-logo strong {
    font-size: 16px;
  }

  .kk-footer-logo-icon {
    width: 46px;
    min-width: 46px;
    height: 46px;
  }

  .footer-widgets .kk-social-icons a {
    width: 42px;
    height: 42px;
  }
}
/* =========================================================
FINAL FOOTER TITLE AND LINK FIX
========================================================= */

/* Classic Widget title */
.footer-widgets .widget-title {
  position: relative;
  margin: 0 0 22px !important;
  padding: 0 0 12px !important;
  color: #ffffff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.footer-widgets .widget-title::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 34px;
  height: 2px;
  content: "";
  border-radius: 4px;
  background: #18b965;
}

/* Remove large heading styling if an H2 remains accidentally */
.footer-widgets .kk-footer-widget h2 {
  margin: 0 0 22px !important;
  color: #ffffff !important;
  font-size: 18px !important;
  line-height: 1.3 !important;
}

/* Footer lists */
.footer-widgets .kk-footer-links {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.footer-widgets .kk-footer-links li {
  margin: 0 0 12px !important;
  padding: 0 !important;
}

/* Prevent GeneratePress blue link color */
.footer-widgets .kk-footer-links a,
.footer-widgets .kk-footer-links a:visited,
.footer-widgets .kk-footer-links a:active {
  position: relative;
  display: inline-block;
  padding-left: 15px;
  color: #9eb8ac !important;
  font-size: 14px;
  line-height: 1.5;
  text-decoration: none !important;
}

.footer-widgets .kk-footer-links a::before {
  position: absolute;
  top: 0.7em;
  left: 0;
  width: 5px;
  height: 5px;
  content: "";
  border-radius: 50%;
  background: #18b965;
  transform: translateY(-50%);
}

.footer-widgets .kk-footer-links a:hover,
.footer-widgets .kk-footer-links a:focus {
  color: #ffffff !important;
}
@supports (-webkit-touch-callout: none) {
  html,
  body {
    overscroll-behavior-y: none;
    overscroll-behavior-x: none;

    
  }
}
