@charset "UTF-8";
/* ===== LIVEBYSTYLE — COMMON CSS ===== */
/* ===== CSS CUSTOM PROPERTIES ===== */
:root {
    /* Colors (from Livebystyle brand style guide) */
    --bg: #F4EFEA;              /* page background */
    --bg-light: #F4EFEA;        /* light backgrounds, sections, cards */
    --primary: #BFA98A;         /* buttons, highlights, icons, accents */
    --secondary: #222222;       /* headings, main text, strong content */
    --accent: #666666;          /* paragraphs, secondary text, icons */
    --danger: #E31E24;
    --white: #FFFFFF;
    --text-dark: #222222;       /* headings / main text */
    --text-light: #666666;      /* paragraphs / secondary text */
    --border: #F4EFEA;

    /* Fonts */
    --font-heading: 'Playfair Display', serif;     /* Hero headings, section titles */
    --font-subheading: 'Poppins', sans-serif;      /* Sub headings, section subtitles (SemiBold) */
    --font-body: 'Inter', sans-serif;               /* Paragraphs, descriptions */
    --font-primary: var(--font-body);

    /* Font sizes (recommended) */
    --fs-h1: 56px;
    --fs-h1-lh: 64px;
    --fs-h2: 40px;
    --fs-h2-lh: 48px;
    --fs-h3: 24px;
    --fs-h3-lh: 30px;
    --fs-body: 16px;
    --fs-body-lh: 26px;
    --fs-small: 14px;
    --fs-btn: 15px;

    /* Spacing */
    --space-xs: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 48px;
}

/* ===== BASE STYLES ===== */
*, *::before, *::after {
    box-sizing: border-box;
}

html {
    height: 100%;
    width: 100%;
}

body {
    height: 100%;
    width: 100%;
    font-family: var(--font-body);
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background-color: var(--bg);
    color: var(--text-dark);
    margin: 0;
    padding: 0;
}

a {
    color: var(--secondary);
    transition: color 0.2s ease;
}
a:hover {
    color: var(--primary);
    text-decoration: none !important;
}

a,
button,
input,
select,
textarea {
    -webkit-tap-highlight-color: transparent;
}

/* ===== TYPOGRAPHY ===== */
p {
    font-size: var(--fs-body);
    line-height: var(--fs-body-lh);
    color: var(--text-light);
    font-weight: 400;
    margin: 0 0 16px 0;
    font-family: var(--font-body);
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    color: var(--text-dark);
    margin: 0 0 16px 0;
    font-family: var(--font-heading);
}

/* Heading sizes per style guide (Playfair Display — big titles / hero) */
h1 { font-size: var(--fs-h1); line-height: var(--fs-h1-lh); font-weight: 700; }
h2 { font-size: var(--fs-h2); line-height: var(--fs-h2-lh); font-weight: 700; }
h3 { font-size: var(--fs-h3); line-height: var(--fs-h3-lh); font-weight: 600; }
h4 { font-size: 20px; line-height: 28px; }
h5 { font-size: 18px; line-height: 26px; }
h6 { font-size: var(--fs-small); line-height: 20px; }

/* Sub headings — Poppins SemiBold, for subtitles / important text */
.sub-heading {
    font-family: var(--font-subheading);
    font-weight: 600;
    color: var(--text-dark);
}

/* Small text — labels, captions, notes */
.small-text {
    font-size: var(--fs-small);
    color: var(--text-light);
}

/* ===== COMMON SECTION TITLE ===== */
.common-title { max-width: 720px; margin-bottom: 32px; }
.common-title__subtitle { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 10px; color: var(--primary); font-family: var(--font-subheading); font-size: 15px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase;}
.common-title__subtitle::after { display: none; }
.common-title__heading { margin: 0; color: var(--text-dark); font-size: var(--fs-h2); line-height: var(--fs-h2-lh); font-weight: 700; letter-spacing: -0.5px; font-family: var(--font-heading);}
.common-title__highlight { color: var(--primary); }
.common-title__text { margin-top: 16px; max-width: 620px; font-size: var(--fs-body); line-height: var(--fs-body-lh); font-family: var(--font-body); color: var(--text-light);}
@media (max-width: 768px) {.common-title { margin-bottom: 24px; }
.common-title__heading { font-size: 30px; line-height: 38px; }
.common-title__subtitle { gap: 10px; margin-bottom: 12px; font-size: 13px; }
.common-title__text { font-size: 15px; }}

/* ===== COMMON BUTTON ===== */
/* Primary Button — Use for: Explore, Become a Distributor, Submit */
.common-btn { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 48px; padding: 12px 36px;  border-radius: 3px;  background: var(--primary); color: var(--white); font-family: var(--font-subheading); font-size: var(--fs-btn); font-weight: 600; line-height: 1; letter-spacing: 0.2px; text-transform: uppercase; text-decoration: none; cursor: pointer; position: relative; transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;}
.common-btn:hover,
.common-btn:focus { text-decoration: none; background: var(--secondary); border-color: var(--secondary); color: var(--white);}
.common-btn::after { display: none; }
.common-btn--outline { background: transparent; color: var(--secondary); box-shadow: none; border: 2px solid var(--secondary);}
.common-btn--outline:hover,
.common-btn--outline:focus {background: var(--secondary); border-color: var(--secondary); color: var(--white);}
.common-btn--dark { background: var(--text-dark); border-color: var(--text-dark); color: var(--white);}
.common-btn--dark:hover,
.common-btn--dark:focus { background: var(--primary); border-color: var(--primary); color: var(--white);}
.common-btn--sm { min-height: 44px; padding: 10px 22px; font-size: 14px; }
.common-btn--lg { min-height: 60px; padding: 16px 40px; font-size: 16px; }

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar {
    width: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--secondary);
}
::-webkit-scrollbar-thumb {
    background: var(--primary);
    border-radius: 10px;
}
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px rgba(0,0,0,0.1);
    border-radius: 10px;
}

/* ===== UTILITY CLASSES ===== */
.bg-dark {
    background-color: var(--text-dark) !important;
    color: var(--white);
}
.bg-light {
    background-color: var(--bg-light) !important;
}
.bg-white {
    background-color: var(--white) !important;
}
.text-primary { color: var(--primary) !important; }
.text-dark { color: var(--text-dark) !important; }
.text-light { color: var(--text-light) !important; }

.content-section {
    padding: 70px 0;
}

/* ===== CARDS ===== */
.work-card {
    background: var(--white);
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(34,34,34,0.08);
    overflow: hidden;
}

.work-content {
    padding: 20px 15px 10px;
}

.client-card {
    padding: 15px;
    background-color: var(--bg-light);
    border-radius: 6px;
    color: var(--text-dark);
}

/* ===== WORDPRESS SPECIFIC ===== */
#wpadminbar {
    display: none !important;
}

.grecaptcha-badge {
    display: none !important;
}

/* ===== CONTAINER ===== */
.container {
    max-width: 1350px;
    margin: 0 auto;
    padding: 0 20px;
}


/* ===== HEADER / NAV STYLES ===== */
/* .navin-header { position: absolute; top: 18px; left: 0; right: 0; z-index: 60; padding: 0; background: transparent;}
.navin-header__inner {  display: flex;  align-items: center;  justify-content: space-between;  gap: 20px;  background: var(--white);  padding: 10px 20px;  border-radius: 40px;  max-width: 1350px;  margin: 0 auto;}
.navin-header__brand { display: flex; align-items: center; }
.navin-header__logo { max-height: 48px; width: auto; display: block; }
.navin-panel-top { display: none; }
.navin-header__nav { display: flex; align-items: center; gap: 18px; }
.navin-header__link { color: var(--text-dark); text-decoration: none; font-weight: 600; padding: 8px 6px; }
.navin-header__cta { padding: 10px 18px; }
.navin-header__toggle { display: none; background: transparent; border: 0; width: 44px; height: 44px; }
.navin-header__toggle span { display: block; width: 22px; height: 2px; background: var(--text-dark); margin: 5px 0; }
@media (max-width: 900px) {
.navin-header { position: absolute; top: 12px; }
.navin-header__inner { padding: 10px 14px; border-radius: 50px; width: calc(100% - 40px); } */
    /* Mobile: convert nav into sliding side panel */
    /* .navin-header__nav { display: flex; position: fixed; top: 0; left: 0; bottom: 0; align-items: stretch; width: 320px; max-width: 90%; background: #f7f7f7; flex-direction: column; gap: 0; padding: 22px 20px; border-radius: 0; transform: translateX(-110%); transition: transform .36s cubic-bezier(.2,.9,.2,1); }
.navin-header__nav a { padding: 12px 0; border-bottom: 1px solid var(--border); }
.navin-header__toggle { display: inline-flex; align-items: center; justify-content: center; }
    .navin-header__nav.open { transform: translateX(0); z-index: 10002; outline: none; }
    .navin-panel-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
    .navin-panel-logo { max-height:40px; }
    .navin-header__close { background: var(--danger); color: #fff; border: 0; width:44px; height:44px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:20px; line-height:1; }
    .navin-header__nav .navin-header__link { padding: 18px 0; font-size:16px; font-weight:700; text-transform:uppercase; color: var(--text-dark); border-bottom: 1px solid rgba(0,0,0,0.04); }
    .navin-header__nav .navin-header__cta { margin-top: 14px; }
.navin-header__toggle.open span { background: var(--primary); }} */

/* ===== LIVE BY STYLE HEADER ===== */
.live-by-style-headermains-header { background: #fff; border-bottom: 1px solid #f0ece8; position: relative; z-index: 100; }
.live-by-style-headermains-inner { align-items: center; display: flex; gap: 28px; margin: 0 auto; max-width: 1720px; min-height: 95px; padding: 10px 32px; }
.live-by-style-headermains-brand { align-items: center; background: transparent; border: 0; border-radius: 0; box-shadow: none; color: #81766b; display: flex; flex: 0 0 245px; height: auto; justify-content: flex-start; text-decoration: none; width: 245px; }
.live-by-style-headermains-brand:hover { color: #81766b; }
.live-by-style-headermains-logo-image { display: block; height: auto; max-width: 100%; width: 80px; }
.live-by-style-headermains-brand-live { margin-left: -13px; }
.live-by-style-headermains-brand-by { margin-left: 20px; }
.live-by-style-headermains-brand-style { margin-left: 3px; }
.live-by-style-headermains-nav { align-items: center; display: flex; flex: 1; gap: clamp(18px, 2.6vw, 54px); justify-content: flex-end; }
.live-by-style-headermains-link, .live-by-style-headermains-products-toggle { background: none; border: 0; color: #403d3a; font-family: var(--font-subheading); font-size: 14px; font-weight: 700; letter-spacing: -.35px; padding: 10px 0; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.live-by-style-headermains-link:hover, .live-by-style-headermains-products-toggle:hover { color: #b39776; }
.live-by-style-headermains-products { position: relative; }
.live-by-style-headermains-products-toggle { cursor: pointer; }
.live-by-style-headermains-arrow { border: solid currentColor; border-width: 0 1.5px 1.5px 0; display: inline-block; height: 6px; margin: 0 0 3px 5px; transform: rotate(45deg); width: 6px; }
.live-by-style-headermains-submenu { background: #fff; box-shadow: 0 10px 24px rgba(0, 0, 0, .12); display: none; left: -18px; min-width: 180px; padding: 9px 18px; position: absolute; top: 100%; }
.live-by-style-headermains-products:hover .live-by-style-headermains-submenu, .live-by-style-headermains-products.is-open .live-by-style-headermains-submenu { display: block; }
.live-by-style-headermains-sublink { color: #403d3a; display: block; font-family: var(--font-body); font-size: 14px; padding: 9px 0; text-decoration: none; }
/* .live-by-style-headermains-cta { background: #d3b28d; border: 4px solid #f3e9dd; border-radius: 8px; color: #403d3a; font-family: var(--font-subheading); font-size: 14px; font-weight: 700; letter-spacing: -.4px; padding: 17px 25px; text-align: center; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.live-by-style-headermains-cta:hover { background: #b89772; color: #fff; } */
.live-by-style-headermains-toggle, .live-by-style-headermains-mobile-top, .live-by-style-headermains-overlay { display: none; }

@media (max-width: 1170px) { .live-by-style-headermains-inner { min-height: 90px; } .live-by-style-headermains-brand { flex-basis: 160px; width: 160px; } .live-by-style-headermains-nav { gap: 17px; } .live-by-style-headermains-link, .live-by-style-headermains-products-toggle, .live-by-style-headermains-cta { font-size: 11px; } .live-by-style-headermains-cta { padding: 13px 15px; } }
@media (max-width: 900px) {
    .live-by-style-headermains-inner { justify-content: space-between; min-height: 82px; padding: 12px 20px; }
    .live-by-style-headermains-brand { flex-basis: 135px; height: auto; width: 135px; }
    .live-by-style-headermains-toggle { align-items: center; background: transparent; border: 0; cursor: pointer; display: flex; flex-direction: column; gap: 5px; height: 45px; justify-content: center; padding: 0; width: 45px; }
    .live-by-style-headermains-toggle-line { background: #252525; display: block; height: 2px; transition: transform .25s ease, opacity .25s ease; width: 25px; }
    .live-by-style-headermains-nav { background: #fff; bottom: 0; display: block; left: 0; max-width: none; overflow-y: auto; padding: 28px 40px 42px; position: fixed; top: 0; transform: translateX(-105%); transition: transform .32s ease; width: 100%; z-index: 102; }
    .live-by-style-headermains-nav.is-open { transform: translateX(0); }
    .live-by-style-headermains-overlay { background: rgba(16, 21, 31, .45); bottom: 0; left: 0; opacity: 0; position: fixed; right: 0; top: 0; transition: opacity .32s ease; visibility: hidden; z-index: 101; }
    .live-by-style-headermains-overlay.is-open { display: block; opacity: 1; visibility: visible; }
    .live-by-style-headermains-mobile-top { align-items: center; display: flex; justify-content: space-between; margin-bottom: 42px; }
    .live-by-style-headermains-mobile-brand { display: block; max-width: 220px; text-decoration: none; }
    .live-by-style-headermains-mobile-logo-image { display: block; height: auto; max-width: 100%; width: 100%; }
    .live-by-style-headermains-close { background: none; border: 0; color: #182033; cursor: pointer; font-size: 38px; font-weight: 300; line-height: 1; padding: 0; }
    .live-by-style-headermains-link, .live-by-style-headermains-products-toggle { color: #182033; display: block; font-family: var(--font-body); font-size: 19px; font-weight: 500; padding: 13px 0; text-align: left; text-transform: none; width: 100%; }
    .live-by-style-headermains-products-toggle { cursor: pointer; }
    .live-by-style-headermains-submenu { box-shadow: none; padding: 0 0 5px 24px; position: static; }
    .live-by-style-headermains-products.is-open .live-by-style-headermains-submenu { display: block; }
    .live-by-style-headermains-sublink { font-size: 16px; padding: 9px 0; }
    .live-by-style-headermains-cta { display: inline-flex; font-size: 13px; margin-top: 20px; padding: 15px 20px; }
    body.live-by-style-headermains-menu-open { overflow: hidden; }
}

/* ===== LIVE BY STYLE FOOTER ===== */
.footer-livebystyleweb-footer { background: #222; color: #eee8df; padding: 52px 0 18px; }
.footer-livebystyleweb-inner { margin: 0 auto; max-width: 1680px; padding: 0 54px; }
.footer-livebystyleweb-grid { display: grid; gap: 50px; grid-template-columns: 1.65fr 1fr 1fr 1.25fr; }
.footer-livebystyleweb-brand { color: #fff; display: inline-block; font-family: var(--font-heading); font-size: 34px; font-weight: 700; line-height: 1.15; margin-bottom: 18px; text-decoration: none; }
.footer-livebystyleweb-brand:hover { color: #d2b58e; }
.footer-livebystyleweb-logo-image { display: block; height: auto; max-width: 105px; width: 100%; }
.footer-livebystyleweb-tagline { color: #d2b58e; font-family: var(--font-heading); font-size: 20px; font-style: italic; line-height: 1.35; margin: 0 0 16px; }
.footer-livebystyleweb-description { color: #e8e1d8; font-family: var(--font-body); font-size: 16px; line-height: 1.7; margin: 0; max-width: 360px; }
.footer-livebystyleweb-socials { display: flex; gap: 12px; margin-top: 25px; }
.footer-livebystyleweb-social { align-items: center; background: #3b3b3b; border-radius: 50%; color: #d9d7d4; display: inline-flex; font-size: 16px; height: 40px; justify-content: center; text-decoration: none; width: 40px; }
.footer-livebystyleweb-social:hover { background: #cdb18c; color: #222; }
.footer-livebystyleweb-heading { color: #fff; font-family: var(--font-subheading); font-size: 18px; font-weight: 700; line-height: 1.2; margin: 1px 0 25px; text-transform: uppercase; }
.footer-livebystyleweb-link { color: #e8e1d8; display: block; font-family: var(--font-body); font-size: 16px; margin: 0 0 13px; text-decoration: none; }
.footer-livebystyleweb-link:hover { color: #d2b58e; }
.footer-livebystyleweb-contact { align-items: flex-start; color: #e8e1d8; display: flex; font-family: var(--font-body); font-size: 16px; gap: 13px; line-height: 1.45; margin: 0 0 16px; text-decoration: none; }
.footer-livebystyleweb-icon { color: #cdb18c; flex: 0 0 22px; font-size: 16px; font-style: normal; line-height: 1; padding-top: 3px; text-align: center; width: 22px; }
.footer-livebystyleweb-social .footer-livebystyleweb-icon { color: inherit; flex: 0 0 auto; padding: 0; width: auto; }
.footer-livebystyleweb-contact:hover { color: #d2b58e; }
.footer-livebystyleweb-cta { background: #cdb18c; border-radius: 4px; color: #fff; display: inline-flex; font-family: var(--font-subheading); font-size: 16px; font-weight: 600; justify-content: center; margin-top: 12px; padding: 12px 20px; text-decoration: none; text-transform: uppercase; width: 100%; }
.footer-livebystyleweb-cta:hover { background: #fff; color: #222; }
.footer-livebystyleweb-bottom { align-items: center; border-top: 1px solid #454545; display: flex; justify-content: space-between; margin-top: 40px; padding-top: 29px; }
.footer-livebystyleweb-copyright { color: #e8e1d8; font-size: 15px; margin: 0; }
.footer-livebystyleweb-legal { display: flex; gap: 30px; }
.footer-livebystyleweb-legal-link { color: #e8e1d8; font-family: var(--font-body); font-size: 15px; text-decoration: none; }
.footer-livebystyleweb-legal-link:hover { color: #d2b58e; }
@media (max-width: 900px) { .footer-livebystyleweb-footer { padding-top: 42px; } .footer-livebystyleweb-inner { padding: 0 24px; } .footer-livebystyleweb-grid { gap: 36px; grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .footer-livebystyleweb-grid { grid-template-columns: 1fr; } .footer-livebystyleweb-brand { font-size: 30px; } .footer-livebystyleweb-bottom { align-items: flex-start; flex-direction: column; gap: 18px; margin-top: 35px; } .footer-livebystyleweb-legal { flex-wrap: wrap; gap: 12px 24px; } }




.bradcrumb-lovebystylecommanjfnd{ position: relative; overflow: hidden; background: var(--secondary); padding: 70px 0;}
.bradcrumb-lovebystylecommanjfnd__content{ position: relative; z-index: 2; max-width: 760px;}
.bradcrumb-lovebystylecommanjfnd__breadcrumb{ display: flex; align-items: center; gap: 12px; margin-bottom: 22px; font-family: var(--font-subheading); font-size: 14px; font-weight: 500; text-transform: uppercase; letter-spacing: .5px;}
.bradcrumb-lovebystylecommanjfnd__breadcrumb a{ color: var(--white); text-decoration: none;}
.bradcrumb-lovebystylecommanjfnd__breadcrumb span{ color: var(--primary);}
.bradcrumb-lovebystylecommanjfnd__title{ font-size: 40px;  line-height: 49px; margin-bottom: 15px;  color: var(--white); max-width: 700px;}
.bradcrumb-lovebystylecommanjfnd__title span{ color: var(--primary);}
.bradcrumb-lovebystylecommanjfnd__text{ max-width: 620px; color: var(--bg); font-size: 16px; line-height: 1.8; margin: 0;}
.bradcrumb-lovebystylecommanjfnd__circle{ position: absolute; border: 1px solid var(--primary); border-radius: 50%;  opacity: .25;}
.bradcrumb-lovebystylecommanjfnd__circle--one{ width: 400px; height: 400px; right: -160px; top: -110px;}
.bradcrumb-lovebystylecommanjfnd__circle--two{ width: 250px; height: 250px; right: -70px;  bottom: -120px;}
@media (max-width:991px){.bradcrumb-lovebystylecommanjfnd{ padding: 70px 0;} .bradcrumb-lovebystylecommanjfnd__title{ max-width: 100%;}
.bradcrumb-lovebystylecommanjfnd__text{font-size: 16px;}
.bradcrumb-lovebystylecommanjfnd__circle--one{ width: 280px; height: 280px;}
.bradcrumb-lovebystylecommanjfnd__circle--two{ width: 180px; height: 180px;}}
@media (max-width:767px){.bradcrumb-lovebystylecommanjfnd{ padding: 60px 0;}
.bradcrumb-lovebystylecommanjfnd__breadcrumb{ margin-bottom: 12px; font-size: 12px; gap: 8px;}
.bradcrumb-lovebystylecommanjfnd__text{ font-size: 15px; line-height: 1.7;}
.bradcrumb-lovebystylecommanjfnd__circle{ display: none;}}




.ctagfgd-sbdsgd{  padding:60px 0;  background:var(--bg);}
.ctagfgd-sbdsgd__wrapper{  background:var(--secondary);  border-radius:10px;  padding:55px 40px;  display:flex;  align-items:center;  justify-content:space-between;  gap:30px;}
.ctagfgd-sbdsgd__content{  max-width:520px;}
.ctagfgd-sbdsgd__title{ margin:0; color:var(--white); font-size: 30px;}
.ctagfgd-sbdsgd__buttons{ display:flex; align-items:center; gap:15px; flex-wrap:wrap;}
.ctagfgd-sbdsgd__buttons .common-btn{ min-width:210px;}
.ctagfgd-sbdsgd__buttons .common-btn--outline{ color:var(--white); border-color:rgba(255,255,255,.3);}
.ctagfgd-sbdsgd__buttons .common-btn--outline:hover{ border-color:var(--primary); background:var(--primary); color:var(--white);}
@media (max-width:991px){.ctagfgd-sbdsgd__wrapper{ flex-direction:column; align-items:flex-start; padding:40px 30px;}}
@media (max-width:767px){.ctagfgd-sbdsgd{ padding:60px 0;} .ctagfgd-sbdsgd__wrapper{  padding:30px 20px;} .ctagfgd-sbdsgd__buttons{ width:100%; flex-direction:column;}
.ctagfgd-sbdsgd__buttons .common-btn{ width:100%;}}