/* =========================================================
   SWAMI IT SOLUTIONS - MAIN STYLESHEET
   ========================================================= */

/* -------------------------------
   IMPORT GOOGLE FONTS
--------------------------------*/
/* @import url("https://fonts.googleapis.com/css2?family=Archivo+Black&family=Archivo:wght@400;500;600;700&family=Poppins:wght@400;500;600;700&display=swap"); */

/* -------------------------------
   ROOT VARIABLES
--------------------------------*/
:root {
  /* COLORS */
  --theme-color: #4E6EF1;
  --theme-color-light: #EBF4FF;
  --text-color: #585978;
  --heading-color: #323450;
  --bg-color: #ffffff;
  --bg-alt-color: linear-gradient(180deg, #E6EEFF 0%, #B3C9FF 100%);
  --border-color: rgba(0, 0, 0, 0.1);

  /* TYPOGRAPHY */
  --font-primary: "Poppins", sans-serif;
  --font-heading: "Archivo Black", sans-serif;
  --font-size-base: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 35px;

  /* SPACING & RADIUS */
  --border-radius: 30px;
  --border-radius-pill: 50px;
  --section-padding: 100px;

  /* EFFECTS */
  --shadow-light: 0px 5px 25px rgba(218, 211, 211, 0.3);
  --shadow-hover: 0px 8px 25px rgba(47, 128, 237, 0.35);
  --transition-fast: 0.3s ease-out;
  --transition-smooth: 0.4s ease-in-out;
}


/* -------------------------------
   BASE STYLES
--------------------------------*/
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: var(--font-primary); color: var(--text-color); background-color: var(--bg-color); overflow-x: hidden; }
a { text-decoration: none; color: inherit; transition: all var(--transition-fast); }
a:hover { color: var(--theme-color); }
p { font-size: var(--font-size-base); line-height: 25px; margin: 0; }
h1,h2,h3,h4,h5,h6 { font-family: var(--font-heading); color: var(--heading-color); margin: 0; }
ul,ol { list-style: none; padding: 0; margin: 0; }
section { padding: 50px 0px; }
.title { padding-bottom: 20px; }
 #navbar, #footer { display: block; min-height: 60px; }
/* -------------------------------
   BUTTON STYLES
--------------------------------*/
.main-btn {
  display: inline-block;
  font-weight: 500;
  padding: 12px 19px;
  margin: 10px;
  font-size: var(--font-size-lg);
  color: #fff;
  border: none;
  border-radius: var(--border-radius-pill);
  background: var(--theme-color);
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: all var(--transition-smooth);
}
.main-btn:hover {
  color: #fff;
  background:#FFC93C;
  box-shadow: var(--shadow-hover);
  border: 2px solid #FFC93C;
}
.main-btn.border-btn {
  border: 2px solid black;
  background: transparent;
  color: var(--heading-color);
}
/* Hover ripple effect */
.btn-hover::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0%;
  height: 0%;
  padding: 50%;
  background:#FFC93C;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
  transition: all var(--transition-fast);
  z-index: -1;
}
.btn-hover:hover::after { transform: translate(-50%, -50%) scale(1.3); background:#FFC93C; }

.btn-theme { background: #0d6efd; color: #fff; border: none; transition: 0.3s; }
.btn-theme:hover { background:#FFC93C; color: #fff; }

/* -------------------------------
   SECTION TITLES
--------------------------------*/
.section-title { color: black; font-weight: 600; text-transform: uppercase; position: relative; margin-bottom: 20px; }
.section-title::after { content: ""; width: 60px; height: 3px; background:#FFC93C; position: absolute; left: 50%; transform: translateX(-50%); bottom: -8px; }

/* -------------------------------
   HERO SECTION
--------------------------------*/
.hero-section { position: relative; z-index: 1; padding: 108px 0; background: var(--bg-alt-color); }
.hero-section .hero-content span { color: var(--theme-color); font-size: 28px; margin-bottom: 20px; display: block; }
.hero-section .hero-content h1 { font-size: 48px; margin: 20px 0; opacity: 0; animation: heroFadeIn 1s forwards; }
.hero-section .hero-content p { font-size: 18px; margin-bottom: 30px; opacity: 0; animation: heroFadeIn 1s 0.5s forwards; }
@keyframes heroFadeIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }

/* -------------------------------
   SERVICES / FEATURE SECTION
--------------------------------*/
.feature-style-5 { background: var(--bg-color); }
.feature-style-5 .single-feature { text-align: center; border-radius: var(--border-radius); border-bottom: 5px solid var(--text-color); padding: 25px 23px; margin: 34px 1px; box-shadow: var(--shadow-light); transition: all var(--transition-fast); }
.feature-style-5 .single-feature:hover { border-color: var(--theme-color); box-shadow: var(--shadow-hover); transform: scale(1.05); }
.single-feature .icon { color: var(--theme-color); margin-bottom: 20px; }

/* -------------------------------
   WHY CHOOSE US SECTION
--------------------------------*/
#why-choose-us { background-color:var(--theme-color-light); padding: 80px 0; }
#why-choose-us h2 { font-weight: 700; margin-bottom: 20px; }
#why-choose-us p { font-size: 16px; color: #6c757d; }
.icon-circle { width: 50px; height: 50px; background-color:var(--theme-color-light); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.feature-box { transition: all 0.3s ease; border: 1px solid transparent; }
.feature-box:hover { transform: translateY(-5px); border: 1px solid #cce6d5; box-shadow: 0 5px 15px rgba(0,0,0,0.08); }

/* -------------------------------
   CONTACT SECTION
--------------------------------*/
.contact .info-item { background-color: var(--bg-color); box-shadow: 0px 0px 20px rgba(0,0,0,0.1); padding: 24px 0 30px 0; }
.contact .info-item i { color: var(--theme-color); width: 56px; height: 56px; font-size: 24px; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease-in-out; border-radius: 50%; border: 2px dotted rgba(0,0,0,0.1); }
.contact .info-item h3 { font-size: 18px; font-weight: 700; margin: 10px 0; }
.contact .info-item p { padding: 0; margin-bottom: 0; font-size: 14px; }