/* =========================
        GLOBAL RESET
        ========================= */

 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 html {
     scroll-behavior: smooth;
 }

 body {
     background: #faf8f3;
     color: #1a0e06;
     font-family: 'Plus Jakarta Sans', sans-serif;
     line-height: 1.6;
     overflow-x: hidden;
 }

 /* =========================
        ROOT VARIABLES
        ========================= */

 :root {

     --bg: #faf8f3;
     --ink: #1a0e06;
     --border: #e4d8c8;

     --primary: #4b8507;
     --primary-dark: #3f7106;

     --white: #ffffff;

     --container: 1200px;

     --section-padding: 100px 60px;

     --h1: 72px;
     --h2: 52px;
     --h3: 32px;

     --text-lg: 20px;
     --text-md: 18px;
     --text-sm: 16px;

     --radius-lg: 20px;
     --radius-md: 16px;

     --transition: 0.4s ease;

 }

 /* =========================
        GLOBAL CLASSES
        ========================= */

 .container {
     width: 100%;
     max-width: var(--container);
     margin: auto;
 }

 .section {
     padding: var(--section-padding);
 }

 .heading-xl {
     font-size: var(--h1);
     line-height: 1.1;
     font-weight: 700;
 }

 .heading-lg {
     font-size: var(--h2);
     line-height: 1.2;
     font-weight: 700;
 }

 .heading-md {
     font-size: var(--h3);
     line-height: 1.3;
     font-weight: 600;
 }

 .text-lg {
     font-size: var(--text-lg);
 }

 .text-md {
     font-size: var(--text-md);
 }

 .text-sm {
     font-size: var(--text-sm);
 }

 /* =========================
        HEADER
        ========================= */

 .main-navbar {

     position: fixed;
     top: 16px;
     left: 50%;
     transform: translateX(-50%);

     width: calc(100% - 48px);
     max-width: 1200px;

     z-index: 1000;

     background: rgba(255, 255, 255, 0.90);

     backdrop-filter: blur(20px);

     border: 1px solid var(--border);

     border-radius: 16px;

     padding: 12px 24px;

     display: flex;
     align-items: center;
     justify-content: space-between;

     box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);

 }

 /* =========================
        LOGO
        ========================= */

 .nav-logo {

     display: flex;
     align-items: center;

 }

 .nav-logo img {

     width: 48px;
     height: auto;
     object-fit: contain;
     display: block;

 }


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

 .nav-menu {

     display: flex;
     align-items: center;
     gap: 42px;
     list-style: none;

 }

 .nav-menu a {

     text-decoration: none;
     color: #7a6a5b;
     font-size: 15px;
     font-weight: 500;
     transition: var(--transition);
     position: relative;

 }

 .nav-menu a:hover {
     color: var(--ink);
 }

 /* =========================
        RIGHT
        ========================= */

 .nav-right {

     display: flex;
     align-items: center;
     gap: 24px;

 }

 .signin-btn {

     text-decoration: none;

     color: #6f6256;

     font-size: 15px;
     font-weight: 500;

     transition: var(--transition);

 }

 .signin-btn:hover {
     color: var(--ink);
 }

 /* =========================
        CTA BUTTON
        ========================= */

 .community-btn {

     display: flex;
     align-items: center;
     gap: 10px;

     background: var(--primary);

     color: var(--white);

     text-decoration: none;

     padding: 14px 22px;

     border-radius: 14px;

     font-size: 15px;
     font-weight: 700;

     transition: var(--transition);

 }

 .community-btn:hover {

     background: var(--primary-dark);

     transform: translateY(-2px);

 }

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

 .mobile-toggle {

     width: 42px;
     height: 42px;

     border: none;
     background: none;

     display: none;

     flex-direction: column;
     justify-content: center;
     gap: 5px;

     cursor: pointer;

 }

 .mobile-toggle span {

     width: 24px;
     height: 2px;

     background: var(--ink);

     border-radius: 10px;

 }

 /* =========================
        DEMO HERO
        ========================= */


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

 @media(max-width:992px) {

     .nav-menu {

         position: absolute;

         top: 100%;
         left: 0;

         width: 100%;

         background: white;

         border: 1px solid var(--border);

         border-radius: 16px;

         padding: 30px;

         flex-direction: column;

         gap: 24px;

         margin-top: 14px;

         opacity: 0;
         visibility: hidden;

         transform: translateY(20px);

         transition: var(--transition);

     }

     .nav-menu.active {

         opacity: 1;
         visibility: visible;

         transform: translateY(0);

     }

     .mobile-toggle {
         display: flex;
     }

 }

 @media(max-width:768px) {

     .main-navbar {

         padding: 12px 18px;

         width: calc(100% - 24px);

     }

     .community-btn {
         display: none;
     }

 }

 @media(max-width:576px) {

     .nav-logo span {
         display: none;
     }

 }

 /* =========================
HERO SECTION
========================= */

 .hero-section {

     padding: 180px 54px 60px;
     max-width: 1280px;
     margin: 0 auto;
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 60px;
     align-items: start;

 }

 /* =========================
LEFT
========================= */

 .hero-left>* {

     opacity: 0;
     padding-top: 40px;
     animation: fadeUp .7s ease forwards;

 }

 /* =========================
PILL
========================= */

 .hero-pill {

     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: rgba(61, 122, 16, 0.12);
     color: #3d7a10;
     font-size: 11px;
     font-weight: 700;
     letter-spacing: .05em;
     text-transform: uppercase;
     padding: 7px 18px;
     border-radius: 100px;
     margin-bottom: 0px;
     animation-delay: .05s;

 }

 .pill-dot {

     width: 8px;
     height: 8px;

     border-radius: 50%;

     background: #4f8b12;

 }

 /* =========================
TITLE
========================= */

 .hero-title {

     font-weight: 800;
     font-size: clamp(4.0rem, 5vw, 3.125rem);
     line-height: 1.02em;
     letter-spacing: -0.045em;
     color: #1a0e06;
     margin-bottom: 26px;
     max-width: 680px;
     animation-delay: .15s;

 }

 .hero-title span {
     color: #4f9d11;
 }

 /* =========================
SUB TEXT
========================= */

 .hero-sub {

     font-size: 18px;
     line-height: 1.75;
     color: #7a6a58;
     max-width: 640px;
     margin-bottom: 10px;
     animation-delay: .28s;

 }

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

 .hero-cta-row {

     display: flex;
     align-items: center;
     gap: 14px;
     margin-bottom: 15px;
     flex-wrap: wrap;
     animation-delay: .4s;

 }

 /* PRIMARY BUTTON */

 .btn-primary {

     background: #3d7a10;
     color: #fff;
     font-weight: 700;
     font-size: 13px;
     padding: 0px 25px;
     height: 58px;
     border-radius: 18px;
     text-decoration: none;
     display: inline-flex;
     align-items: center;
     gap: 10px;
     transition: .3s;

 }

 .btn-primary:hover {

     background: #2d5e09;
     transform: translateY(-2px);

 }

 /* SECONDARY BUTTON */

 .btn-secondary {

     background: #f2ece0;
     color: #1a0e06;
     font-weight: 600;
     height: 58px;
     font-size: 13px;
     padding: 0px 25px;
     border-radius: 18px;
     text-decoration: none;
     border: 1px solid #e4d8c8;
     transition: .3s;
     display: inline-flex;
     align-items: center;
 }

 .btn-secondary:hover {

     transform: translateY(-2px);
     background: #ece4d6;

 }

 /* =========================
SOCIAL PROOF
========================= */

 .hero-social-proof {

     display: flex;
     align-items: center;
     gap: 18px;
     animation-delay: .52s;
     font-size: 13px;

 }

 .hero-avatars {

     display: flex;
     align-items: center;

 }

 .avatar {

     width: 30px;
     height: 30px;

     border-radius: 50%;

     border: 2px solid #fff;

     margin-left: -10px;

     font-size: 14px;

     font-weight: 700;

     display: flex;

     align-items: center;
     justify-content: center;

     color: #fff;

 }

 .avatar:first-child {
     margin-left: 0;
 }

 .avatar-green {
     background: #4f9d11;
 }

 .avatar-orange {
     background: #c26d1f;
 }

 .hero-social-proof p {

     font-size: 18px;

     color: #6d5f54;

 }

 .hero-social-proof strong {
     color: #1a0e06;
 }

 /* =========================
RIGHT GRID
========================= */

 .hero-right {

     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 12px;
     align-self: start;

 }

 /* =========================
CARD
========================= */

 .hero-card {

     background: #fff;
     border: 1px solid #e4d8c8;
     border-radius: 22px;
     padding: 10px 24px 10px 24px;
     min-height: 200px;
     transition: .35s;
     cursor: pointer;

 }

 .hero-card:hover {

     transform: translateY(-6px);
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.06);

 }

 .hero-card-icon {

     font-size: 26px;
     margin-bottom: 15px;

 }

 .hero-card h3 {

     font-size: 15px;
     line-height: 1.3;
     margin-bottom: 14px;
     font-weight: 700;

 }

 .hero-card p {

     font-size: 13px;
     line-height: 1.5;
     color: #7a6a58;
     margin-bottom: 20px;

 }

 .hero-card-bottom h2 {

     font-size: 30px;
     line-height: 1;
     font-weight: 800;
     margin-bottom: 4px;

 }

 .hero-card-bottom span {

     color: #7a6a58;
     font-size: 12px;

 }

 /* =========================
DARK CARD
========================= */

 .dark-card {

     background: #1a0700;
     border: none;
     color: #fff;

 }

 .dark-card p,
 .dark-card span {
     color: #d4c4b7;
 }

 /* =========================
SUMMIT CARD
========================= */

 .summit-card {

     grid-column: span 2;
     background: #3d7a10;
     border: none;
     color: #fff;
     display: flex;
     justify-content: space-between;
     align-items: flex-start;
     min-height: 140px;
     padding: 30px 34px;

 }

 .summit-card p {
     color: #d8efc5;
 }

 .summit-price {

     text-align: right;

 }

 .summit-price h2 {

     font-size: 30px;
     line-height: 0.75;
     font-weight: 800;

 }

 .summit-price span {

     color: #d9f2c7;
     font-size: 15px;

 }

 /* =========================
PODCAST CARD
========================= */

 .podcast-card {

     background: #e9f0dc;

 }

 .podcast-card h2 {
     font-size: 30px;
 }

 /* JOB CARD */
 .hero-card-bottom span {
     font-size: 15px;
 }

 .podcast-card h3,
 .podcast-card h2 {
     color: #4f9d11;
 }

 /* =========================
ANIMATION
========================= */

 @keyframes fadeUp {

     0% {

         opacity: 0;

         transform: translateY(24px);

     }

     100% {

         opacity: 1;

         transform: translateY(0);

     }

 }

 /* =========================
STATS BAR
========================= */

 .stats-bar {

     background: #1a0700;
     padding: 30px 60px;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 0;
     margin-top: 10px;

 }

 /* =========================
STATS ITEM
========================= */

 .stats-item {

     flex: 1;
     text-align: center;
     position: relative;
     padding: 20px 8px 20px 8px;

 }

 /* BORDER */

 .stats-item:not(:last-child)::after {

     content: "";
     position: absolute;
     top: 50%;
     right: 0;
     transform: translateY(-50%);
     width: 1px;
     height: 50px;
     background: rgba(255, 255, 255, 0.12);

 }

 /* NUMBER */

 .stats-item h2 {

     font-size: 30px;
     line-height: 0.75;
     font-weight: 800;
     color: #ffffff;
     margin-bottom: 12px;
     letter-spacing: -0.04em;

 }

 /* GOLD ITEMS */

 .stats-item:first-child h2,
 .stats-item:nth-child(4) h2 {

     color: #dba63a;

 }

 /* TEXT */

 .stats-item p {

     font-size: 13px;
     color: #b8aba0;
     font-weight: 500;

 }

 /* =========================
PROBLEM SECTION
========================= */

 .problem-section {

     background: #f2ece0;
     padding: 100px 60px;

 }

 /* =========================
TOP
========================= */

 .problem-top {

     margin-bottom: 60px;

 }

 /* EYEBROW */

 .section-eyebrow {

     display: inline-flex;
     align-items: center;
     gap: 8px;
     font-size: 12px;
     font-weight: 700;
     letter-spacing: .1em;
     text-transform: uppercase;
     color: #3d7a10;
     margin-bottom: 18px;

 }

 /* TITLE */

 .problem-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);
     font-weight: 800;
     color: #1a0e06;
     letter-spacing: -0.05em;
     line-height: 1.05;
     margin-bottom: 22px;
     max-width: 700px;

 }

 /* SUB TEXT */

 .section-sub-text {

     font-size: 18px;

     color: #7a6a58;

     line-height: 1.9;

     max-width: 620px;

     font-weight: 400;

 }

 /* =========================
GRID
========================= */

 .problem-grid {

     display: grid;

     grid-template-columns: repeat(3, 1fr);

     gap: 18px;

 }

 /* =========================
CARD
========================= */

 .problem-card {

     background: #ffffff;

     border: 1px solid #e4d8c8;

     border-radius: 22px;

     padding: 34px;

     transition: .35s ease;

     cursor: default;

 }

 .problem-card:hover {

     transform: translateY(-5px);

     box-shadow: 0 16px 36px rgba(0, 0, 0, 0.06);

     border-color: rgba(61, 122, 16, 0.08);

 }

 /* ICON */

 .problem-icon {

     font-size: 28px;

     margin-bottom: 26px;

 }

 /* HEADING */

 .problem-card h3 {

     font-size: 20px;

     line-height: 1.1;

     margin-bottom: 15px;

     font-weight: 800;

     color: #1a0e06;

 }

 /* TEXT */

 .problem-card p {

     font-size: 14px;

     line-height: 1.9;

     color: #7a6a58;

 }

 /* =========================
HIGHLIGHT CARD
========================= */

 .problem-highlight {

     background: #4a970e;

     border: none;

 }

 .problem-highlight h3,
 .problem-highlight p {

     color: #ffffff;

 }

 .problem-highlight p {

     opacity: .9;

 }

 /* =========================
FEATURES SECTION
========================= */

 .features-section {

     max-width: 1200px;
     margin: 0 auto;
     padding: 100px 60px;

 }

 /* =========================
TOP
========================= */

 .features-top {

     margin-bottom: 60px;

 }

 /* EYEBROW */

 .section-eyebrow {

     display: inline-flex;
     align-items: center;
     gap: 8px;
     font-size: 12px;
     font-weight: 700;
     letter-spacing: .1em;
     text-transform: uppercase;
     color: #3d7a10;
     margin-bottom: 18px;

 }

 /* TITLE */

 .features-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);
     font-weight: 800;
     line-height: 1.03;
     letter-spacing: -0.05em;
     color: #1a0e06;
     margin-bottom: 22px;

 }

 /* SUB TEXT */

 .section-sub-text {

     max-width: 520px;
     font-size: 15px;
     line-height: 1.9;
     color: #7a6a58;

 }

 /* =========================
BENTO GRID
========================= */

 .features-bento {

     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 18px;

 }

 /* =========================
CARD
========================= */

 .bento-card {

     background: #ffffff;
     border: 1px solid #e4d8c8;
     border-radius: 22px;
     padding: 20px;
     transition: .35s ease;

 }

 .bento-card:hover {

     transform: translateY(-4px);
     box-shadow: 0 14px 36px rgba(0, 0, 0, 0.06);
     border-color: transparent;

 }

 /* LARGE CARD */

 .bento-card.large {

     grid-column: span 2;
     background: #3d7a10;
     border-color: #3d7a10;

 }

 /* DARK CARD */

 .bento-card.dark {

     background: #1a0700;
     border-color: #1a0700;

 }

 /* LIGHT COLORS */

 .soft-green {

     background: #edf5e0;
     border-color: rgba(61, 122, 16, 0.15);

 }

 .soft-yellow {

     background: #fdf3e3;

     border-color: rgba(192, 122, 26, 0.2);

 }

 .soft-light {

     background: #edf5e0;

     border-color: rgba(61, 122, 16, 0.15);

 }

 /* =========================
ICON
========================= */

 .bento-icon {

     width: 40px;
     height: 40px;

     border-radius: 12px;

     display: flex;

     align-items: center;
     justify-content: center;

     background: rgba(255, 255, 255, 0.14);

     font-size: 18px;

     margin-bottom: 26px;

 }

 /* =========================
TEXT
========================= */

 .bento-card h3 {

     font-size: 25px;

     line-height: 1.25;

     font-weight: 800;

     margin-bottom: 12px;

     color: #1a0e06;

 }

 .bento-card p {

     font-size: 13px;

     line-height: 1.9;

     color: #6f6256;

     margin-bottom: 15px;

 }

 /* DARK/LARGE TEXT */

 .large h3,
 .large p,
 .dark h3,
 .dark p {

     color: #ffffff;

 }

 .large p,
 .dark p {

     opacity: .9;

 }

 /* =========================
TAGS
========================= */

 .bento-tag {

     display: inline-flex;

     align-items: center;

     justify-content: center;

     padding: 7px 14px;

     border-radius: 100px;

     font-size: 11px;

     font-weight: 800;

     letter-spacing: .04em;

     text-transform: uppercase;

 }

 /* TAG COLORS */

 .green-tag {

     background: rgba(61, 122, 16, 0.12);

     color: #4a970e;

 }

 .yellow-tag {

     background: rgba(192, 122, 26, 0.12);

     color: #b97818;

 }

 .dark-tag {

     background: rgba(255, 255, 255, 0.12);

     color: #ffffff;

 }

 /* =========================
DASHBOARD SECTION
========================= */

 .dashboard-section {

     max-width: 1200px;

     margin: 0 auto;

     padding: 100px 60px;

     display: grid;

     grid-template-columns: 1fr 1fr;

     gap: 80px;

     align-items: center;

 }

 /* =========================
LEFT
========================= */

 .dashboard-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);
     line-height: 1.05;

     font-weight: 800;

     letter-spacing: -0.05em;

     margin-bottom: 22px;

     color: #1a0e06;

 }

 .dashboard-text {

     font-size: 15px;

     line-height: 1.9;

     color: #7a6a58;

     max-width: 520px;

     margin-bottom: 28px;

 }

 /* =========================
CHIP
========================= */

 .redirect-chip {

     display: inline-flex;

     align-items: center;

     gap: 12px;

     background: #f2ece0;

     border: 1px solid #e4d8c8;

     padding: 12px 18px;

     border-radius: 12px;

     margin-bottom: 32px;

     font-size: 12px;

     font-family: 'JetBrains Mono', monospace;

     color: #7a6a58;

     flex-wrap: wrap;

 }

 .redirect-chip .arrow {

     color: #3d7a10;

     font-weight: 700;

 }

 /* BUTTON */

 .dashboard-btn {

     margin-top: 4px;

 }

 /* =========================
RIGHT MOCKUP
========================= */

 .dash-v3-mockup {

     background: #ffffff;

     border: 1px solid #e4d8c8;

     border-radius: 22px;

     overflow: hidden;

     box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);

 }

 /* =========================
TOPBAR
========================= */

 .dash-v3-topbar {

     display: flex;

     align-items: center;

     gap: 14px;

     padding: 10px 14px;

     background: #f4ede2;

     border-bottom: 1px solid #e4d8c8;

 }

 /* DOTS */

 .dash-dots {

     display: flex;

     align-items: center;

     gap: 6px;

 }

 .dash-v3-topbar .dot {

     width: 10px;
     height: 10px;

     border-radius: 50%;

 }

 .dot.red {
     background: #ff5f57;
 }

 .dot.yellow {
     background: #febc2e;
 }

 .dot.green {
     background: #28c840;
 }

 /* URL */

 .dash-v3-url {

     flex: 1;

     background: #ffffff;

     border: 1px solid #e4d8c8;

     border-radius: 7px;

     padding: 6px 12px;

     font-family: 'JetBrains Mono', monospace;

     font-size: 10px;

     color: #7a6a58;

     text-align: center;

 }

 /* =========================
BODY
========================= */

 .dash-v3-body {

     padding: 24px;

 }

 /* HEADER */

 .dash-header {

     display: flex;

     align-items: center;

     justify-content: space-between;

     margin-bottom: 18px;

 }

 .dash-header h4 {

     font-size: 18px;

     font-weight: 700;

 }

 /* BADGE */

 .plan-badge {

     background: #edf5e0;

     color: #4a970e;

     font-size: 10px;

     font-weight: 700;

     padding: 6px 10px;

     border-radius: 100px;

 }

 /* =========================
STATS
========================= */

 .dash-stats {

     display: grid;

     grid-template-columns: repeat(3, 1fr);

     gap: 12px;

     margin-bottom: 18px;

 }

 .dash-stat-card {

     background: #f2ece0;

     border-radius: 12px;

     padding: 16px;

 }

 .dash-stat-card h3 {

     font-size: 38px;

     line-height: 1;

     margin-bottom: 8px;

     font-weight: 800;

 }

 .dash-stat-card p {

     font-size: 11px;

     color: #7a6a58;

 }

 /* =========================
PROGRESS CARD
========================= */

 .dash-progress-card {

     background: #3d7a10;

     border-radius: 14px;

     padding: 18px;

     margin-bottom: 14px;

 }

 .dash-progress-card h5 {

     color: #ffffff;

     font-size: 14px;

     margin-bottom: 14px;

     font-weight: 700;

 }

 /* BAR */

 .progress-bar {

     width: 100%;

     height: 6px;

     border-radius: 100px;

     background: rgba(255, 255, 255, 0.2);

     overflow: hidden;

     margin-bottom: 10px;

 }

 .progress-bar span {

     display: block;

     width: 72%;

     height: 100%;

     background: #dba63a;

     border-radius: 100px;

 }

 /* BOTTOM */

 .progress-bottom {

     display: flex;

     justify-content: space-between;

     align-items: center;

 }

 .progress-bottom small {

     color: #ffffff;

     opacity: .9;

     font-size: 10px;

 }

 /* =========================
ALERT
========================= */

 .dash-alert {

     background: #edf5e0;

     border: 1px solid rgba(61, 122, 16, 0.2);

     color: #5a7c39;

     border-radius: 12px;

     padding: 14px 16px;

     font-size: 12px;

     line-height: 1.6;

 }

 /* =========================
JOIN SECTION
========================= */

 .join-section {

     background: #1a0700;

     padding: 100px 60px;

     text-align: center;

 }

 /* =========================
BADGE
========================= */

 .join-badge {

     display: inline-flex;

     align-items: center;

     gap: 8px;

     background: rgba(61, 122, 16, 0.2);

     color: #7ec84a;

     font-size: 12px;

     font-weight: 700;

     letter-spacing: .06em;

     text-transform: uppercase;

     padding: 8px 18px;

     border-radius: 100px;

     margin-bottom: 30px;

     border: 1px solid rgba(61, 122, 16, 0.3);

 }

 /* =========================
TITLE
========================= */

 .join-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);
     line-height: 1.05;

     font-weight: 800;

     letter-spacing: -0.05em;

     color: #ffffff;

     margin-bottom: 22px;

 }

 /* =========================
TEXT
========================= */

 .join-subtext {

     max-width: 720px;

     margin: 0 auto 60px;

     font-size: 18px;

     line-height: 1.9;

     color: #b8aba0;

 }

 /* =========================
CARDS
========================= */

 .join-cards {

     display: grid;

     grid-template-columns: repeat(3, 1fr);

     gap: 20px;

     text-align: left;

     max-width: 1150px;

     margin: 0 auto 42px;

 }

 /* =========================
CARD
========================= */

 .join-card {

     background: rgba(255, 255, 255, 0.05);

     border: 1px solid rgba(255, 255, 255, 0.1);

     border-radius: 22px;

     padding: 34px 30px;

     position: relative;

     transition: .35s ease;

     backdrop-filter: blur(10px);

 }

 .join-card:hover {

     background: rgba(255, 255, 255, 0.08);

     transform: translateY(-5px);

 }

 /* =========================
FEATURED
========================= */

 .join-card.featured-join {

     background: linear-gradient(145deg, #3d7a10 0%, #5cad1a 100%);

     border-color: #3d7a10;

     transform: scale(1.03);

 }

 .join-card.featured-join:hover {

     transform: scale(1.03) translateY(-5px);

 }

 /* POPULAR */

 .join-popular {

     position: absolute;

     top: -12px;

     left: 50%;

     transform: translateX(-50%);

     background: #3d7a10;

     color: #ffffff;

     font-size: 10px;

     font-weight: 800;

     letter-spacing: .1em;

     text-transform: uppercase;

     padding: 6px 16px;

     border-radius: 100px;

     white-space: nowrap;

 }

 /* =========================
ICON
========================= */

 .join-icon {

     width: 42px;
     height: 42px;

     border-radius: 12px;

     display: flex;

     align-items: center;
     justify-content: center;

     font-size: 20px;

     margin-bottom: 28px;

 }

 /* COLORS */

 .join-icon.purple {

     background: rgba(130, 92, 255, 0.15);

 }

 .join-icon.yellow {

     background: rgba(255, 215, 0, 0.15);

 }

 .join-icon.gold {

     background: rgba(255, 200, 0, 0.12);

 }

 /* =========================
TEXT
========================= */

 .join-card h3 {

     font-size: 28px;

     line-height: 1.2;

     font-weight: 800;

     margin-bottom: 16px;

     color: #ffffff;

 }

 .join-card p {

     font-size: 15px;

     line-height: 1.9;

     color: #c7bbb0;

     margin-bottom: 28px;

 }

 /* FEATURED TEXT */

 .featured-join p {

     color: #ebffd9;

 }

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

 .join-btn {

     width: 100%;

     height: 52px;

     border-radius: 12px;

     display: flex;

     align-items: center;
     justify-content: center;

     gap: 8px;

     text-decoration: none;

     font-size: 14px;

     font-weight: 700;

     transition: .3s;

 }

 /* GREEN */

 .green-btn {

     background: #3d7a10;

     color: #ffffff;

 }

 .green-btn:hover {

     background: #4b9613;

 }

 /* WHITE */

 .white-btn {

     background: #ffffff;

     color: #3d7a10;

 }

 .white-btn:hover {

     transform: translateY(-2px);

 }

 /* OUTLINE */

 .outline-btn {

     border: 1px solid rgba(255, 255, 255, 0.25);

     color: #ffffff;

 }

 .outline-btn:hover {

     background: rgba(255, 255, 255, 0.06);

 }

 /* =========================
BOTTOM FEATURES
========================= */

 .join-features {

     display: flex;

     justify-content: center;

     align-items: center;

     flex-wrap: wrap;

     gap: 28px;

 }

 .join-features span {

     font-size: 14px;

     color: #a79688;

 }

 /* =========================
PLANS SECTION
========================= */

 .plans-section {

     background: #f2ece0;

     padding: 100px 60px;

 }

 /* =========================
HEADER
========================= */

 .plans-header {

     display: flex;

     justify-content: space-between;

     align-items: flex-end;

     gap: 40px;

     margin-bottom: 52px;

 }

 /* TITLE */

 .plans-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);
     line-height: 1.05;

     font-weight: 800;

     letter-spacing: -0.05em;

     color: #1a0e06;

 }

 /* SUBTEXT */

 .plans-subtext {

     max-width: 420px;

     font-size: 16px;

     line-height: 1.9;

     color: #7a6a58;

 }

 /* =========================
GRID
========================= */

 .plans-grid {

     display: grid;

     grid-template-columns: repeat(3, 1fr);

     gap: 20px;

 }

 /* =========================
CARD
========================= */

 .plan-card-v3 {

     background: #ffffff;

     border: 1px solid #e4d8c8;

     border-radius: 24px;

     padding: 15px 20px;

     position: relative;

     transition: .35s ease;

 }

 .plan-card-v3:hover {

     transform: translateY(-5px);

     box-shadow: 0 18px 42px rgba(0, 0, 0, 0.07);

 }

 /* FEATURED */

 .featured-plan {

     background: #1a0700;

     border-color: #1a0700;

     transform: scale(1.03);

 }

 .featured-plan:hover {

     transform: scale(1.03) translateY(-5px);

 }

 /* =========================
LABEL
========================= */

 .plan-label {

     display: block;

     font-size: 11px;

     letter-spacing: .12em;

     font-weight: 800;

     color: #9b7d65;

     margin-bottom: 22px;

 }

 /* =========================
PRICE
========================= */

 .plan-price {

     margin-bottom: 34px;

 }

 .plan-price h3 {

     font-size: 40px;

     line-height: 1;

     font-weight: 800;

     letter-spacing: -0.05em;

     margin-bottom: 10px;

     color: #1a0e06;

 }

 .plan-price span {

     font-size: 13px;

     color: #8a7b6e;

 }

 /* FEATURED PRICE */

 .featured-plan .plan-price h3,
 .featured-plan .plan-price span,
 .featured-plan .plan-label {

     color: #ffffff;

 }

 /* =========================
LIST
========================= */

 .plan-v3-list {

     list-style: none;

     display: flex;

     flex-direction: column;

     gap: 16px;

     margin-bottom: 34px;

 }

 .plan-v3-list li {

     font-size: 14px;

     line-height: 1.7;

     color: #2e1c0a;

     display: flex;

     align-items: flex-start;

     gap: 10px;

 }

 /* FEATURED LIST */

 .featured-plan .plan-v3-list li {

     color: #ffffff;

 }

 /* =========================
BUTTON
========================= */

 .plan-btn {

     width: 100%;
     height: 54px;
     border-radius: 12px;

     display: flex;

     align-items: center;
     justify-content: center;

     text-decoration: none;

     font-size: 12px;

     font-weight: 700;

     transition: .3s ease;

 }

 /* PRIMARY */

 .primary-plan-btn {

     background: #3d7a10;

     color: #ffffff;

 }

 .primary-plan-btn:hover {

     background: #4b9613;

 }

 /* SECONDARY */

 .secondary-plan-btn {

     border: 1px solid #dccfbe;

     color: #1a0e06;

 }

 .secondary-plan-btn:hover {

     background: #f7f1e8;

 }

 /* =========================
ABOUT SECTION
========================= */

 .about-section {

     padding: 100px 60px;

     background: #faf8f3;

 }

 /* =========================
WRAPPER
========================= */

 .about-wrapper {

     max-width: 1200px;

     margin: 0 auto;

     display: grid;

     grid-template-columns: 1.1fr .9fr;

     gap: 70px;

     align-items: start;

 }

 /* =========================
LEFT
========================= */

 .about-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);

     line-height: 1.05;

     font-weight: 800;

     letter-spacing: -0.05em;

     color: #1a0e06;

     margin-bottom: 26px;

 }

 .about-text {

     font-size: 15px;

     line-height: 1.9;

     color: #7a6a58;

     margin-bottom: 22px;

     max-width: 620px;

 }

 /* =========================
INFO LIST
========================= */

 .about-info-list {

     margin-top: 40px;

     display: flex;

     flex-direction: column;

     gap: 14px;

 }

 /* BOX */

 .about-info-box {

     display: flex;

     gap: 16px;

     align-items: flex-start;

     background: #ffffff;

     border: 1px solid #e4d8c8;

     border-radius: 18px;

     padding: 20px 22px;

     transition: .3s ease;

 }

 .about-info-box:hover {

     transform: translateY(-3px);

     box-shadow: 0 12px 28px rgba(0, 0, 0, 0.05);

 }

 /* ICON */

 .about-info-icon {

     width: 42px;
     height: 42px;

     border-radius: 12px;

     display: flex;

     align-items: center;
     justify-content: center;

     font-size: 18px;

     flex-shrink: 0;

 }

 /* COLORS */

 .about-info-icon.pink {

     background: #ffe5ef;

 }

 .about-info-icon.green {

     background: #edf5e0;

 }

 .about-info-icon.orange {

     background: #fff0df;

 }

 /* TEXT */

 .about-info-box h4 {

     font-size: 15px;

     font-weight: 800;

     margin-bottom: 6px;

     color: #1a0e06;

 }

 .about-info-box p {

     font-size: 13px;

     line-height: 1.8;

     color: #7a6a58;

 }

 /* =========================
RIGHT
========================= */

 .about-right {

     display: flex;

     flex-direction: column;

     gap: 18px;

 }

 /* =========================
STATS GRID
========================= */

 .about-stats-grid {

     display: grid;

     grid-template-columns: 1fr 1fr;

     gap: 14px;

 }

 /* CARD */

 .about-stat-card {

     border-radius: 18px;

     padding: 28px;

     border: 1px solid #e4d8c8;

 }

 /* GREEN */

 .green-card {

     background: #4a970e;

     border-color: #4a970e;

 }

 .green-card h3,
 .green-card p {

     color: #ffffff;

 }

 /* LIGHT */

 .light-card {

     background: #f2ece0;

 }

 /* TEXT */

 .about-stat-card h3 {

     font-size: 30px;

     line-height: 1;

     font-weight: 700;

     margin-bottom: 10px;

     letter-spacing: -0.05em;

 }

 .about-stat-card p {

     font-size: 12px;

     color: #4a3d2d;

 }

 /* =========================
QUOTE
========================= */

 .about-quote-card {

     background: #1a0700;

     border-radius: 20px;

     padding: 34px;

 }

 .about-quote-card h4 {

     font-size: 18px;

     line-height: 1.5;

     font-weight: 700;

     font-style: italic;

     color: #ffffff;

     margin-bottom: 18px;

 }

 .about-quote-card span {

     font-size: 13px;

     color: #bba99a;

 }

 /* =========================
ORGANIZATION SECTION
========================= */

 .org-section {

     background: #1a0700;

     padding: 100px 60px;

 }

 /* =========================
WRAPPER TOP
========================= */

 .org-top {

     max-width: 1200px;

     margin: 0 auto 54px;

     display: flex;

     justify-content: space-between;

     gap: 80px;

     align-items: flex-start;

 }

 /* =========================
TITLE
========================= */

 .org-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);

     line-height: 1.05;

     font-weight: 800;

     letter-spacing: -0.05em;

     color: #ffffff;

     margin-top: 6px;

 }

 .org-title span {

     color: #d79a32;

 }

 /* =========================
RIGHT
========================= */

 .org-top-right {

     max-width: 500px;

 }

 .org-top-right p {

     font-size: 15px;

     line-height: 1.9;

     color: #c1afa1;

     margin-bottom: 28px;

 }

 /* =========================
BUTTON
========================= */

 .org-btn {

     width: 210px;

     height: 54px;

     border-radius: 12px;

     background: #ffffff;

     color: #3d7a10;

     font-size: 14px;

     font-weight: 700;

     text-decoration: none;

     display: flex;

     align-items: center;

     justify-content: center;

     transition: .3s ease;

 }

 .org-btn:hover {

     transform: translateY(-2px);

 }

 /* =========================
GRID
========================= */

 .org-grid {

     max-width: 1200px;

     margin: 0 auto;

     display: grid;

     grid-template-columns: repeat(4, 1fr);

     gap: 16px;

 }

 /* =========================
CARD
========================= */

 .org-card {

     background: rgba(255, 255, 255, 0.05);

     border: 1px solid rgba(255, 255, 255, 0.1);

     border-radius: 18px;

     padding: 28px 22px;

     transition: .35s ease;

 }

 .org-card:hover {

     background: rgba(255, 255, 255, 0.08);

     transform: translateY(-4px);

 }

 /* =========================
ICON
========================= */

 .org-icon {

     width: 38px;
     height: 38px;

     border-radius: 10px;

     display: flex;

     align-items: center;

     justify-content: center;

     background: rgba(255, 255, 255, 0.08);

     font-size: 18px;

     margin-bottom: 22px;

 }

 .org-icon.pink {

     background: rgba(255, 90, 150, 0.12);

 }

 .org-icon.purple {

     background: rgba(130, 92, 255, 0.12);

 }

 .org-icon.gold {

     background: rgba(255, 200, 0, 0.12);

 }

 /* =========================
TEXT
========================= */

 .org-card h3 {

     font-size: 18px;

     line-height: 1.35;

     font-weight: 800;

     color: #ffffff;

     margin-bottom: 14px;

 }

 .org-card p {

     font-size: 13px;

     line-height: 1.8;

     color: #baa99a;

     margin-bottom: 22px;

 }

 /* PRICE */

 .org-card span {

     font-size: 20px;

     line-height: 1;

     font-weight: 800;

     color: #d79a32;

 }

 /* =========================
CERT + SUMMIT SECTION
========================= */

 .cert-summit-section {

     display: grid;

     grid-template-columns: 1fr 1fr;

     min-height: 100vh;

 }

 /* =========================
LEFT
========================= */

 .cert-v3 {

     padding: 100px 56px;

     background: #faf8f3;

     border-right: 1px solid #e4d8c8;

 }

 /* TITLE */

 .cert-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);

     line-height: 1.02;

     font-weight: 800;

     letter-spacing: -0.06em;

     color: #1a0e06;

     margin-bottom: 26px;

 }

 /* TEXT */

 .cert-text {

     max-width: 700px;

     font-size: 15px;

     line-height: 1.8;

     color: #7a6a58;

     margin-bottom: 40px;

 }

 /* =========================
STEPS
========================= */

 .cert-steps {

     display: flex;

     flex-direction: column;

     gap: 12px;

     margin-bottom: 38px;

 }

 /* STEP */

 .cert-step {

     display: flex;

     align-items: flex-start;

     gap: 14px;

     background: #ffffff;

     border: 1px solid #e4d8c8;

     border-radius: 16px;

     padding: 16px 18px;

     transition: .3s ease;

 }

 .cert-step:hover {

     transform: translateY(-2px);

     box-shadow: 0 10px 24px rgba(0, 0, 0, 0.04);

 }

 /* NUMBER */

 .cert-step-num {

     width: 24px;
     height: 24px;

     border-radius: 50%;

     background: #3d7a10;

     color: #ffffff;

     font-size: 10px;

     font-weight: 800;

     display: flex;

     align-items: center;

     justify-content: center;

     flex-shrink: 0;

 }

 /* STEP TEXT */

 .cert-step h4 {

     font-size: 15px;

     line-height: 1.4;

     font-weight: 800;

     color: #1a0e06;

     margin-bottom: 4px;

 }

 .cert-step p {

     font-size: 13px;

     color: #7a6a58;

     line-height: 1.7;

 }

 /* BUTTON */

 .cert-btn {

     width: 190px;

     height: 54px;

     border-radius: 14px;

     background: #3d7a10;

     color: #ffffff;

     text-decoration: none;

     display: flex;

     align-items: center;

     justify-content: center;

     gap: 8px;

     font-size: 15px;

     font-weight: 700;

     transition: .3s ease;

 }

 .cert-btn:hover {

     background: #4a9512;

 }

 /* =========================
RIGHT
========================= */

 .summit-v3 {

     background: #3f8508;

     padding: 100px 56px;

 }

 /* EYEBROW */

 .summit-eyebrow {

     color: #d5efad;

 }

 /* TITLE */

 .summit-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);

     line-height: 1.02;

     font-weight: 800;

     letter-spacing: -0.06em;

     color: #ffffff;

     margin-bottom: 10px;

 }

 /* ICON */

 .summit-icon {

     font-size: 44px;

     margin-bottom: 24px;

 }

 /* TEXT */

 .summit-text {

     max-width: 760px;

     font-size: 15px;

     line-height: 1.9;

     color: #edf7db;

     margin-bottom: 42px;

 }

 /* =========================
INFO
========================= */

 .summit-info {

     display: flex;

     flex-direction: column;

     gap: 18px;

     margin-bottom: 42px;

 }

 /* ROW */

 .summit-row {

     background: rgba(255, 255, 255, 0.12);

     border-radius: 14px;

     padding: 18px 20px;

     display: flex;

     justify-content: space-between;

     align-items: center;

     gap: 20px;

 }

 .summit-row span {

     font-size: 12px;

     color: #d5efad;

 }

 .summit-row strong {

     font-size: 13px;

     color: #ffffff;

 }

 /* PRICE */

 .price-green {

     color: #2f6408 !important;

 }

 /* BUTTON */

 .summit-btn {

     width: 220px;

     height: 50px;

     border-radius: 14px;

     background: #ffffff;

     color: #3d7a10;

     text-decoration: none;

     display: flex;

     align-items: center;

     justify-content: center;

     font-size: 15px;

     font-weight: 700;

     transition: .3s ease;

 }

 .summit-btn:hover {

     transform: translateY(-2px);

 }

 /* =========================
CONTACT SECTION
========================= */

 .contact-section {

     background: #f2ece0;

     padding: 100px 60px;

 }

 /* =========================
WRAPPER
========================= */

 .contact-wrapper {

     max-width: 1280px;

     margin: 0 auto;

     display: grid;

     grid-template-columns: .9fr 1.1fr;

     gap: 70px;

     align-items: start;

 }

 /* =========================
LEFT
========================= */

 .contact-title {

     font-size: clamp(2.4rem, 4vw, 3.0rem);

     line-height: 1.03;

     font-weight: 800;

     letter-spacing: -0.06em;

     color: #1a0e06;

     margin-bottom: 28px;

 }

 .contact-text {

     max-width: 620px;

     font-size: 18px;

     line-height: 1.9;

     color: #7a6a58;

     margin-bottom: 42px;

 }

 /* =========================
CONTACT METHOD CARDS
========================= */

 .contact-method {

     display: flex;

     gap: 20px;

     align-items: flex-start;

     background: #ffffff;

     border: 1px solid #e4d8c8;

     border-radius: 14px;

     padding: 16px 20px;
     margin-bottom: 12px;
     transition: all .2s ease;

 }

 /* HOVER */

 .contact-method:hover {

     border-color: rgba(61, 122, 16, 0.3);

     box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05);

     transform: translateY(-2px);

 }

 /* =========================
ICON
========================= */

 .contact-method-icon {

     width: 34px;
     height: 34px;

     display: flex;

     align-items: center;
     justify-content: center;

     font-size: 18px;

     flex-shrink: 0;

     margin-top: 2px;

 }

 /* =========================
LABEL
========================= */

 .contact-method span {

     display: block;

     font-size: 11px;

     font-weight: 700;

     letter-spacing: .08em;

     color: #8d745d;

     margin-bottom: 4px;

 }

 /* =========================
VALUE
========================= */

 .contact-method-value {

     font-size: 15px;

     font-weight: 600;

     line-height: 1.5;

     color: #1a0e06;

 }

 /* =========================
GREEN CARD
========================= */

 .whatsapp-box {

     background: #edf5e0;

     border-color: rgba(61, 122, 16, 0.14);

 }

 .green-text {

     color: #3d7a10;

 }

 /* =========================
RIGHT
========================= */

 .contact-form-box {

     background: #ffffff;

     border: 1px solid #e4d8c8;

     border-radius: 24px;

     padding: 40px;

 }

 .contact-form-box h3 {

     font-size: 22px;

     line-height: 1.1;

     font-weight: 800;

     color: #1a0e06;

     margin-bottom: 34px;

 }

 /* =========================
FORM
========================= */

 .form-row {

     display: grid;

     grid-template-columns: 1fr 1fr;

     gap: 12px;

 }

 /* GROUP */

 .form-group {

     margin-bottom: 20px;

 }

 .form-group label {

     display: block;

     font-size: 12px;

     font-weight: 800;

     color: #1a0e06;

     margin-bottom: 10px;

 }

 /* INPUTS */

 .form-group input,
 .form-group select,
 .form-group textarea {

     width: 100%;

     height: 50px;

     border-radius: 14px;

     border: 1px solid #dccfbe;

     background: #faf8f3;

     padding: 0 18px;

     font-size: 15px;

     color: #1a0e06;

     font-family: 'Plus Jakarta Sans', sans-serif;

     outline: none;

     transition: .3s ease;

 }

 /* TEXTAREA */

 .form-group textarea {

     height: 100px;

     padding-top: 18px;

     resize: none;

 }

 /* FOCUS */

 .form-group input:focus,
 .form-group select:focus,
 .form-group textarea:focus {

     border-color: #3d7a10;

     background: #ffffff;

 }

 /* BUTTON */

 .contact-submit-btn {

     width: 100%;

     height: 60px;

     border: none;

     border-radius: 14px;

     background: #3d7a10;

     color: #ffffff;

     font-size: 17px;

     font-weight: 700;

     cursor: pointer;

     transition: .3s ease;

     margin-top: 8px;

 }

 .contact-submit-btn:hover {

     background: #4a9512;

 }

 /* FOOT */

 .contact-foot {

     text-align: center;

     margin-top: 22px;

     font-size: 15px;

     color: #7a6a58;

 }

 .contact-foot a {

     color: #3d7a10;

     font-weight: 700;

     text-decoration: none;

 }


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

 .main-footer {

     background: var(--surface);

     border-top: 1px solid var(--border);

     padding: 60px;

 }

 /* =========================
FOOTER TOP
========================= */

 .footer-top {

     display: grid;

     grid-template-columns: 1.2fr 1fr 1fr 1fr 1.1fr;

     gap: 60px;

     padding-bottom: 48px;

     border-bottom: 1px solid #ddd2c4;

 }

 /* =========================
ABOUT
========================= */

 .footer-about img {

     width: 70px;

     margin-bottom: 18px;

 }

 .footer-about p {

     font-size: 15px;

     line-height: 1.8;

     color: #6f6256;

     max-width: 320px;

     margin-bottom: 26px;

 }

 /* =========================
BADGE
========================= */

 .footer-badge {

     display: inline-flex;

     align-items: center;

     gap: 10px;

     background: #fff;

     border: 1px solid var(--border);

     border-radius: 50px;

     padding: 12px 18px;

     font-size: 14px;

     font-weight: 600;

     color: #4f8b12;

 }

 .footer-badge .dot {

     width: 8px;
     height: 8px;

     border-radius: 50%;

     background: #4f8b12;

 }

 /* =========================
COLUMN
========================= */

 .footer-column h4,
 .footer-contact h4 {

     font-size: 13px;

     letter-spacing: 1px;

     font-weight: 800;

     color: #7a6a5b;

     margin-bottom: 22px;

 }

 .footer-links-v3 {

     list-style: none;

     display: flex;
     flex-direction: column;

     gap: 14px;

 }

 .footer-links-v3 a {

     font-size: 15px;

     color: #1a0e06;

     text-decoration: none;

     font-weight: 500;

     transition: 0.2s;

 }

 .footer-links-v3 a:hover {
     color: #3d7a10;
 }

 /* =========================
CONTACT
========================= */

 .footer-contact h5 {

     font-size: 26px;

     font-weight: 700;

     margin-bottom: 2px;

 }

 .footer-contact .designation {

     display: block;

     color: #8a7b6e;

     margin-bottom: 16px;

     font-size: 15px;

 }

 .footer-contact a {

     display: block;

     text-decoration: none;

     color: #1a0e06;

     margin-bottom: 12px;

     font-size: 15px;

     font-weight: 500;

     word-break: break-word;

 }

 .phone-link {

     display: flex !important;

     align-items: center;

     gap: 10px;

 }
 .mdw-social-icons {
    margin-top: 15px;
}
 .mdw-social-icons{
    display:flex;
    align-items:center;
    gap:15px;
}

.mdw-social-icons .mdw-icon{
    width:45px;
    height:45px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-size:20px;
    color:#fff;
    transition:0.3s ease;
}

.mdw-social-icons .instagram{
    background:#E1306C;
}

.mdw-social-icons .youtube{
    background:#FF0000;
}

.mdw-social-icons .linkedin{
    background:#0077B5;
}

.mdw-social-icons .mdw-icon:hover{
    transform:translateY(-4px);
    opacity:0.9;
}
.body-container-wrapper {
    padding: 150px 0;
}
.body-container-wrapper h1, .body-container-wrapper h2, .body-container-wrapper h3 {
    margin-bottom: 20px;
}
.body-container-wrapper  p{
    margin-bottom:15px;
}
 /* =========================
BOTTOM
========================= */

 .footer-bottom {

     padding-top: 28px;

     display: flex;

     align-items: center;
     justify-content: space-between;

     gap: 20px;

 }

 .footer-bottom p,
 .footer-bottom span {

     font-size: 14px;

     color: #7c6e62;

 }
@media(max-width:767px){
.contact-wrapper {
    display: block;
}

.contact-wrapper .contact-left {
    margin-bottom: 40px;
}

.contact-wrapper .form-row {
    display: block;
}
}