@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&display=swap');

:root {
    --bg-dark: #000d22;
    --text-light: #ffffff;
    --text-muted: #a0aec0;
    --accent-gold: #d3933e;
    --accent-gold-hover: #d3933e;
    --border-color: rgba(255, 255, 255, 0.1);
    --transition-speed: 0.3s;
    --text-font: "Manrope", sans-serif;
    /*--heading-font: "Cormorant Garamond", serif;*/
    --heading-font: "Fraunces", serif;
    --line: #cbb98a;
    --text-dark: #001f3f;
    --text-body: #001f3f;
}

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

body {
    /*font-family: 'Inter', sans-serif;*/
    font-family: var(--text-font);
    color: var(--text-light);
    background-color: var(--heading-font);
    /* Assuming the main page body might be light, footer is dark */
    line-height: 1.6;
}

a {
    text-decoration: none;
    color: inherit;
    transition: color var(--transition-speed) ease;
}

ul {
    list-style: none;
}


    section#shopify-section-template--17112933236943__featured_collection_PtGeMR .collection {
    padding-top: 70px;
    padding-bottom: 70px;
}

section#shopify-section-template--17112933236943__featured_collection_PtGeMR {}

section#shopify-section-template--17112933236943__featured_collection_PtGeMR .collection .collection__title {
    text-align: center;
}

section#shopify-section-template--17112933236943__featured_collection_PtGeMR .collection__title h2.title {
    /* font-family: var(--heading-font); */
    font-weight: 600;
    font-size: 48px;
    line-height: 1.2;
    margin: 0 auto;
    max-width: 900px;
    color: #02205f;
    padding-bottom: 15px;
    font-family: var(--heading-font);
    letter-spacing: 0;
}

.collection__description.subtitle p {
    font-size: 16px;
    color: #02205e;
    max-width: 650px;
    margin: 0 auto 70px;
    line-height: 1.6;
    font-weight: normal;
    font-family: var(--text-font);
}

.card-wrapper.product-card-wrapper {
    gap: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(247, 249, 251, 0.9) 100%);
    border: 1px solid #e4e4e4;
    box-shadow: 0 15px 35px rgba(0, 13, 34, 0.04);
    border-radius: 15px;
    overflow: hidden;
}

.card__media .media > img {
    border-radius: 10px;
}

.card__heading .full-unstyled-link {
    font-size: 15px;
    font-weight: normal;
    font-family: var(--text-font);
    color: #02205f;
    font-weight: 600;
    letter-spacing: 0;
    font-family: var(--text-font);
}

.card-information .price__container {}

.card-information .price__container span.price-item {
    font-size: 15px;
    font-weight: 500;
    font-family: var(--text-font);
    color: #02205f;
    letter-spacing: 0;
}

.card-information  .price.price--on-sale {}

.price__sale s.price-item.price-item--regular {
    /* font-size: 15px; */
    font-weight: normal;
    font-family: var(--text-font);
    color: #737373;
    letter-spacing: 0;
}

span.price-item.price-item--sale.price-item--last {}

#shopify-section-template--17112933236943__featured_collection_PtGeMR button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 15px 30px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
    background-color: #001f3f;
    color: #fff;
    border: 2px solid #001f3f;
    font-family: var(--text-font);
}

/* --- HEADER SECTION --- */
.main-header {
    background-color: #ffffff;
    color: #333;
    padding: 20px 40px;
    border-bottom: 1px solid #eaeaea;
    position: sticky;
    top: 0;
    z-index: 1000;
}

.header-container {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-left {
    display: flex;
    align-items: center;
    gap: 40px;
}

.logo-img {
    height: 40px;
    transition: transform var(--transition-speed) ease;
}

.logo-img:hover {
    transform: scale(1.05);
}

.main-nav ul {
    display: flex;
    gap: 30px;
}

.main-nav a {
    font-size: 16px;
    font-weight: 500;
    color: #555;
    position: relative;
}

.main-nav a:hover,
.main-nav a.active {
    color: #111;
}

.main-nav a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -4px;
    left: 0;
    background-color: #111;
    transition: width var(--transition-speed) ease;
}

.main-nav a:hover::after,
.main-nav a.active::after {
    width: 100%;
}

.header-right {
    display: flex;
    gap: 25px;
}

.icon-link {
    font-size: 20px;
    color: #555;
    transition: color var(--transition-speed) ease, transform 0.2s ease;
}

.icon-link:hover {
    color: #111;
    transform: translateY(-2px);
}

/* --- FOOTER SECTION --- */
.main-footer {
    background-color: var(--bg-dark);
    color: var(--text-light);
    padding: 60px 40px 20px;
    font-size: 14px;
}

.footer-container {
    max-width: 1400px;
    margin: 0 auto;
}

.footer-top {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    margin-bottom: 50px;
}

.footer-brand .footer-logo {
    height: auto;
    /*filter: brightness(0) invert(1);*/
}

.footer-tagline {
    font-size: 24px;
    font-weight: 300;
    border-left: 0px solid var(--accent-gold);
    padding-left: 0px;
}

.footer-tagline p {
    margin-bottom: 5px;
    font-weight: 500;
}

.tagline-highlight {
    color: var(--accent-gold);
    font-weight: 500;
}

.footer-newsletter h4 {
    color: var(--accent-gold);
    font-size: 14px;
    margin-bottom: 10px;
    
    font-family: var(--text-font)
}
.newsletter-form form {
    display: flex;
    width: 100%;
}

.newsletter-form form input[type="email"] {
    width: auto;
    outline: none;
    box-shadow: none;
}

.newsletter-form form button {
    width: auto;
    padding: 0 10px;
    font-family: var(--text-font);
    font-weight: normal;
}

.footer-newsletter p {
    margin-bottom: 20px;
    color: var(--text-muted);
    font-family: var(--text-font);
    font-weight: normal;
}

.newsletter-form {
    display: flex;
    align-items: center;
}

.newsletter-form input {
    background: transparent;
    border: 1px solid var(--border-color);
    padding: 12px 15px;
    color: var(--text-light);
    width: 250px;
    outline: none;
    border-radius: 4px 0 0 4px;
    transition: border-color var(--transition-speed) ease;
}

.newsletter-form input:focus {
    border-color: var(--accent-gold);
}

.newsletter-form button {
    background-color: var(--accent-gold);
    color: var(--bg-dark);
    border: none;
    padding: 13px 20px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 0 4px 4px 0;
    transition: background-color var(--transition-speed) ease, transform 0.2s ease;
    display: flex;
    align-items: center;
    gap: 10px;
}

.newsletter-form button:hover {
    background-color: var(--accent-gold-hover);
}

.footer-divider {
    border: none;
    border-top: 1px solid var(--border-color);
    margin: 40px 0;
}

.footer-divider-subtle {
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    margin: 40px 0;
}

.footer-middle {
    display: grid;
    grid-template-columns: repeat(5, 1fr) 1.5fr;
    gap: 30px;
}

.footer-links-col h4,
.footer-connect-col h4 {
    color: var(--accent-gold);
    font-size: 14px;
    margin-bottom: 20px;
    
    text-transform: uppercase;
}

.footer-links-col ul li {
    margin-bottom: 12px;
}

.footer-links-col ul li a {
    color: var(--text-muted);
    font-size: 14px;
    position: relative;
    transition: all var(--transition-speed) ease;
    font-weight: normal;
}

.footer-links-col ul li a:hover {
    color: var(--text-light);
    padding-left: 5px;
    /* Smooth slide right animation on hover */
}

.footer-connect-col {
    border-left: 1px solid var(--border-color);
    padding-left: 40px;
}

.social-icons {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-bottom: 30px;
}

.social-icons a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--accent-gold);
    border-radius: 50%;
    color: var(--accent-gold);
    font-size: 16px;
    transition: all var(--transition-speed) ease;
}

.social-icons a:hover {
    background-color: var(--accent-gold);
    color: var(--bg-dark);
    transform: translateY(-3px);
}

.secure-checkout {
    display: flex;
    align-items: center;
    gap: 15px;
    color: var(--text-muted);
}

.secure-checkout i {
    font-size: 24px;
    color: var(--accent-gold);
}

.secure-checkout div {
    display: flex;
    flex-direction: column;
}

.footer-bottom {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.features-row {
    display: flex;
    justify-content: space-between;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--border-color);
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 15px;
    color: var(--text-muted);
    font-weight: normal;
}

.feature-item i {
    font-size: 24px;
    color: var(--accent-gold);
}

.copyright-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--text-muted);
    font-weight: normal;
}

.legal-links {
    display: flex;
    gap: 20px;
    font-weight: normal;
}

.legal-links a {
    color: var(--accent-gold);
    font-weight: normal;
}

.legal-links a:hover {
    color: var(--accent-gold-hover);
    text-decoration: underline;
}

.footer-tagline-bottom {
    text-align: center;
    margin-top: 40px;
    color: var(--text-muted);
    font-size: 12px;
    
    text-transform: uppercase;
}

.xray-section {
    width: 100%;
    padding: 70px 32px 40px;
    background:
        radial-gradient(1200px 600px at 50% 0%, #fbf6ea 0%, transparent 60%),
        var(--cream);
    position: relative;
    overflow: hidden;
    background: #fff;
}

.xray-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle at 15% 30%, rgba(212, 168, 75, 0.05) 0 2px, transparent 3px),
        radial-gradient(circle at 85% 60%, rgba(212, 168, 75, 0.05) 0 2px, transparent 3px);
    background-size: 220px 220px, 180px 180px;
    pointer-events: none;
    opacity: 0.6;
}

.container {
    max-width: 1400px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

/* Eyebrow */
.xray-section .eyebrow {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}

.xray-section .eyebrow .line {
    width: 42px;
    height: 1px;
    background: #b9720a;
}

.xray-section .eyebrow span {
    font-size: 12px;
    font-weight: 600;
    
    text-transform: uppercase;
    color: #b9720a;
}

/* Top layout: left text + center bottle + right numbered features */
.xray-section .top-grid {
    display: grid;
    grid-template-columns: .33fr .3fr;
    gap: 30px;
    align-items: start;
    justify-content: space-between;
}

/* LEFT column */
.xray-section .left-col {
    padding-top: 8px;
    position: relative;
    z-index: 99;
}

.xray-section .title {
    /* font-family: var(--heading-font); */
    font-size: clamp(2.2rem, 4.2vw, 5rem);
    font-weight: 500;
    line-height: 1.05;
    color: #001f3f;
    margin-bottom: 22px;
    font-family: var(--heading-font);
}

.xray-section .title .accent {
    color: #b9720a;
    display: block;
}

.xray-section .lede {
    font-size: 16px;
    color: #2b3a5a;
    line-height: 1.65;
    max-width: 420px;
    margin-bottom: 0px;
    font-weight: normal;
    letter-spacing: 0;
    font-family: var(--text-font);
}

.xray-section .thin-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 26px;
}

.xray-section .thin-divider .l {
    flex: 0 0 90px;
    height: 1px;
    background: #b9720a;
}

.xray-section .thin-divider .hex {
    width: 14px;
    height: 14px;
    border: 1.2px solid #b9720a;
    transform: rotate(30deg);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

.xray-section .thin-divider .r {
    flex: 1;
    height: 1px;
    background: #b9720a;
    opacity: 0.35;
}

/* 4 mini icon columns */
.xray-section .pillars {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-bottom: 32px;
    gap: 0;
}

.xray-section .pillar {
    text-align: center;
    padding: 0 4px;
    font-family: var(--text-font);
}

.xray-section .pillar .icon {
    width: 46px;
    height: 46px;
    margin: 0 auto 10px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #001f3f;
}

.xray-section .pillar .icon img {
    width: 100%;
}

.xray-section .pillar .icon svg {
    width: 32px;
    height: 32px;
}

.xray-section .pillar h4 {
    font-size: 12px;
    font-weight: 700;
    
    color: #001f3f;
    margin-bottom: 6px;
    font-family: var(--text-font)
}

.xray-section .pillar p {
    font-size: 12px;
    color: #001f3f;
    line-height: 14px;
    font-weight: normal;
}

/* Science banner */
.xray-section .science {
    display: flex;
    align-items: center;
    gap: 16px;
    background: transparent;
    border: 1px solid #b9720a;
    border-radius: 8px;
    padding: 12px 15px;
    max-width: 460px;
}

.xray-section .science .flask {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    color: #001f3f;
}

.xray-section .science h5 {
    font-size: 13px;
    font-weight: 600;
    
    color: #b9720a;
    margin-bottom: 4px;
    font-family: var(--text-font);
    letter-spacing: 0;
}

.xray-section .science p {
    font-size: 12.5px;
    color: #001f3f;
    line-height: 1.5;
    font-family: var(--text-font);
    letter-spacing: 0;
    font-weight: normal;
}

/* CENTER bottle */
.xray-section .bottle-wrap {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 640px;
    margin: auto;
    left: 0;
    right: 0;
    z-index: 9;
}

.xray-section .bottle-wrap::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% 45%, rgba(212, 168, 75, 0.10) 0%, transparent 55%);
    pointer-events: none;
}

.xray-section .bottle-wrap img {
    max-width: 560px;
    /* max-height: 640px; */
    /* object-fit: contain; */
    /* position: relative; */
    z-index: 2;
}

/* RIGHT column - numbered features */
.xray-section .numbered-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding-top: 8px;
    position: relative;
    z-index: 99;
}

.xray-section .num-item {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    position: relative;
    background: linear-gradient(90deg, rgba(247, 249, 251, 0.9) 0%, rgba(247, 249, 251, 0.9) 100%);
    border: 1px solid rgba(240, 231, 220, 0.45);
    /*box-shadow: 0 15px 35px rgba(0, 13, 34, 0.04);*/
    border-radius: 15px;
    padding: 12px 15px;
    font-family: var(--text-font);
}

.xray-section .num-badge {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: transparent;
    border: 1.5px solid #b9720a;
    background-color: #b9720a;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    display: grid;
    place-items: center;
}

.xray-section .num-icon {
    flex-shrink: 0;
    width: 58px;
    height: 59px;
    color: #001f3f;
}

.xray-section .num-icon svg {
    width: 100%;
    height: 100%;
}

.xray-section .num-content {
    flex: 1;
    /* font-family: var(--text-font); */
}

.xray-section .num-content h3 {
    font-size: 13px;
    font-weight: 700;
    
    color: #001f3f;
    margin-bottom: 6px;
    font-family: var(--text-font);
    letter-spacing: 0;
}
.xray-section .num-icon img {
    max-width: 50px;
}
.xray-section .num-content p {
    font-size: 13px;
    color: #001f3f;
    line-height: 1.2;
    max-width: 260px;
    font-family: var(--text-font);
    letter-spacing: 0;
    font-weight: normal;
}

/* Bottom guarantees */
.xray-section .guarantees {
    margin-top: 150px;
    padding-top: 26px;
    border-top: 1px solid #e5dfd0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(247, 249, 251, 0.9) 100%);
    border: 1px solid rgba(240, 231, 220, 0.45);
    box-shadow: 0 15px 35px rgba(0, 13, 34, 0.04);
    border-radius: 15px;
    padding: 22px 20px;
    position: relative;
    z-index: 99;
}

.xray-section .g-item {
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--text-font);
}

.xray-section .g-icon {
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    border-radius: 0;
    border: 0px solid #e5dfd0;
    display: grid;
    place-items: center;
    color: #001f3f;
}

.xray-section .g-icon svg {
    width: 24px;
    height: 24px;
}

.xray-section .g-content h4 {
    font-size: 12px;
    font-weight: 700;
    
    color: #001f3f;
    margin-bottom: 3px;
    font-family: var(--text-font);
}

.xray-section .g-content p {
    font-size: 12px;
    color: #001f3f;
    line-height: 1.4;
    font-weight: 600;
}

.section-header.shopify-section-group-header-group {
    z-index: 9999;
}


/*===================== about page css =========================*/

.inner-page.about-page {}

h1.main-page-title.page-title {
    display: none;
}

.inner-page.about-page section.hero-section {
    background: linear-gradient(135deg, #f8f5f6 0%, #f8f5f6 100%);
    padding: 0;
}

.page-width.page-width--narrow {
    width: 100%;
    max-width: 100%;
    padding: 0;
}

.inner-page.about-page .liposome-bg {
    /* position: absolute; */
    /* left: -40%; */
    top: 50%;
    transform: translateY(0%);
    z-index: 1;
    /* animation: pulseFloat 8s ease-in-out infinite alternate; */
    mix-blend-mode: multiply;
    max-width: none;
    height: auto;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    /* height: 100%; */
    /* width: 100%; */
    margin: 0;
    width: auto;
}


  .inner-page.about-page .hero{
    position: relative;
    overflow: hidden;
  }
 
  .inner-page.about-page .hero-inner{
    
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    align-items: center;
    gap: 40px;
    padding: 0px 64px 0;
  }
 
  /* ---------- LEFT COLUMN ---------- */
  .inner-page.about-page .brand{
    display:flex;
    align-items:center;
    gap: 14px;
    margin-bottom: 5px;
  }
  .inner-page.about-page .brand-mark{
    width: 46px; height: 46px;
    border: 1.5px solid var(--accent-gold);
    display:flex; align-items:center; justify-content:center;
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    
    font-size: 20px;
    color: #001f3f;
  }
  .inner-page.about-page .brand-text .brand-name{
    font-size: 26px;
    letter-spacing: 3px;
    color: #001f3f;
    font-weight: 700;
  }
  .inner-page.about-page .brand-text .brand-tag{
    font-size: 10px;
    letter-spacing: 3px;
    color: var(--accent-gold);
    margin-top: 2px;
    
  }
 
  .inner-page.about-page .headline{
    font-size: 55px;
    line-height: 1.15;
    font-weight: 800;
    color: #001f3f;
    margin-bottom: 16px;
    font-family: var(--heading-font);
  }
  .inner-page.about-page .headline .accent, .inner-page.about-page .headline sup { color: var(--accent-gold); }
 
  .inner-page.about-page .eyebrow{
    font-size: 13px;
    letter-spacing: 1px;
    color: #001f3f;
    font-weight: 600;
    margin-bottom: 20px;
    font-family: var(--heading-font);
  }
 
  .inner-page.about-page .intro{
    font-size: 16px;
    line-height: 1.6;
    color: var(--text-body);
    max-width: 620px;
    margin-bottom: 22px;
    font-family: var(--text-font);
    font-weight: 400;
  }
 
  .inner-page.about-page .compare-box{
    border: 1px solid #000;
    border-radius: 6px;
    display: flex;
    align-items: center;
    padding: 16px 22px;
    gap: 18px;
    max-width: 640px;
    margin-bottom: 22px;
    background: rgba(255,255,255,0.4);
  }
  .inner-page.about-page .compare-item{
    display:flex;
    align-items:center;
    gap: 10px;
    
    font-size: 13.5px;
    color: #001f3f;
    flex: 1;
    
    font-size: 15px;
    line-height: normal;
    color: var(--text-body);
    max-width: 520px;
    margin-bottom: 0;
    font-family: var(--text-font);
    font-weight: 400;
  }
  .inner-page.about-page .compare-icon{
    width: 22px; height: 22px;
    border-radius: 50%;
    border: 1.5px solid;
    flex-shrink: 0;
    display:flex; align-items:center; justify-content:center;
    font-size: 12px;
    flex: unset;
    min-width: 22px;
  }
  .inner-page.about-page .compare-icon.no{ border-color: #b04a3c; color:#b04a3c; }
  .inner-page.about-page .compare-icon.yes{ border-color: #001f3f; color:#001f3f; }
  .inner-page.about-page .compare-item.yes-text{ font-weight: 700; }
  .inner-page.about-page .divider-v{
    width: 1px;
    align-self: stretch;
    background: #000;
  }
  
  .inner-page.about-page .divider-v span {
    position: relative;
    left: -10px;
    background: #000;
    color: #fff;
    top: 10px;
    border-radius: 30px;
    width: 22px;
    height: 22px;
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.inner-page.about-page .brand .image > img {
    max-width: 290px;
}
 
  .inner-page.about-page .body-text{
    font-size: 16px;
    line-height: 1.6;
    color: var(--text-body);
    max-width: 720px;
    margin-bottom: 22px;
    font-family: var(--text-font);
    font-weight: 400;
  }
  .inner-page.about-page .callout{
    font-weight: 700;
    color: #001f3f;
    font-size: 16px;
    line-height: 1.5;
    margin-bottom: 26px;
  }
 
  .inner-page.about-page .features{
    display:flex;
    align-items:center;
    gap: 20px;
    margin-bottom: 30px;
    
  }
  .inner-page.about-page .feature{
    display:flex;
    align-items:center;
    gap: 10px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    color: #001f3f;
    flex-direction: column;
  }
  .inner-page.about-page .feature-icon{
    width: 30px; height: 30px;
    flex-shrink: 0;
  }
  .inner-page.about-page .feature-sep{
    width: 1px;
    height: 26px;
    background: #000;
  }
 
  .inner-page.about-page .cta{
    display:inline-flex;
    align-items:center;
    gap: 12px;
    background: #001f3f;
    color: #fff;
    
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 1.5px;
    padding: 16px 26px;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s ease;
  }
  .inner-page.about-page .cta:hover{ background: #001f3f(--navy-dark); }
  .inner-page.about-page .cta svg{ width: 14px; height: 14px; }
 
  
  /* ---------- BOTTOM STRIP ---------- */
  .inner-page.about-page .strip{
    background: #001f3f;
    color: #fff;
    margin-top: 0px;
    padding: 18px 20px;
    display:flex;
    justify-content: center;
    align-items:center;
    gap: 30px;
    
    font-size: 12px;
    letter-spacing: 2px;
    font-weight: 700;
  }
  .inner-page.about-page .strip .brand-mark-small{
    width: 30px; height:30px;
    border:1.5px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display:flex; align-items:center; justify-content:center;
    font-size: 13px;
  }
  .inner-page.about-page .strip-dot{ color: var(--accent-gold); }
  
  
  .mobile-credentials{ display:none; }
  
  
  .inner-page .problem-section{
    position: relative;
    overflow: hidden;
    /*background: linear-gradient(180deg, #f4f2ec 0%, #eeece4 100%);*/
    background: #fff;
    padding: 64px 0px 0;
  }

  /* side photo decorations */
  .inner-page .problem-section .side-photo{
    position: absolute;
    top: 0;
    height: 100%;
    width: 320px;
    object-fit: cover;
    opacity: 0.9;
    z-index: 0;
  }
  .inner-page .problem-section .side-photo.left{
    left: 0;
    -webkit-mask-image: linear-gradient(to right, black 40%, transparent 100%);
    mask-image: linear-gradient(to right, black 40%, transparent 100%);
  }
  .inner-page .problem-section .side-photo.right{
    right: 0;
    -webkit-mask-image: linear-gradient(to left, black 40%, transparent 100%);
    mask-image: linear-gradient(to left, black 40%, transparent 100%);
  }

  .inner-page .problem-section .problem-inner{
    position: relative;
    z-index: 1;
    max-width: 1240px;
    margin: 0 auto;
  }

  /* ---------- HEADER ---------- */
  .inner-page .problem-section .eyebrow-row{
    display:flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    margin-bottom: 26px;
  }
  .inner-page .problem-section .eyebrow{
    
    font-size: 13px;
    letter-spacing: 5px;
    font-weight: 700;
    color: var(--accent-gold);
  }
  .inner-page .problem-section .eyebrow .dot{ margin: 0 10px; }
  .inner-page .problem-section .hex-divider{
    display:flex;
    align-items:center;
    gap: 12px;
  }
  .inner-page .problem-section .hex-divider .rule{
    width: 140px;
    height: 1px;
    background: var(--line);
  }
  .inner-page .problem-section .hex-divider .hex{
    width: 26px; height: 26px;
    border: 1.3px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display:flex; align-items:center; justify-content:center;
    font-size: 12px;
    color: var(--accent-gold);
  }

  .inner-page .problem-section .headline{
    text-align: center;
    font-size: 44px;
    line-height: 1.2;
    font-weight: 700;
    color: #001f3f;
    margin-bottom: 26px;
  }
  .inner-page .problem-section .headline .accent{ color: var(--accent-gold); }

  .inner-page .problem-section .lede{
    text-align: center;
    font-size: 16px;
      line-height: 1.6;
      max-width: 620px;
      margin-bottom: 22px;
      font-family: var(--text-font);
      color: var(--text-dark);
      font-weight: 400;
      margin: auto auto 30px auto;
  }

  .inner-page .problem-section .quote-box{
    display:flex;
    justify-content: center;
    margin-bottom: 48px;
  }
  .inner-page .problem-section .quote-box p{
    font-size: 19px;
    color: #001f3f;
    border-top: 1.5px solid var(--accent-gold);
    border-bottom: 1.5px solid var(--accent-gold);
    padding: 14px 30px;
  }

  /* ---------- THREE COLUMN GRID ---------- */
  .inner-page .problem-section .columns{
    display: grid;
    grid-template-columns: 0.85fr 1.3fr 0.85fr;
    gap: 32px;
    align-items: start;
    margin-bottom: 56px;
  }

  .inner-page .problem-section .panel{
    background: #fff;
    border: 1px solid #e4ddc9;
    border-radius: 6px;
    box-shadow: 0 6px 20px rgba(18,50,74,0.05);
    overflow: hidden;
  }

  .inner-page .problem-section .panel-header{
    background: #1a1a1a;
    color: #fff;
    
    font-size: 12px;
    letter-spacing: 1.5px;
    font-weight: 700;
    text-align: center;
    padding: 14px 12px;
  }
  .inner-page .problem-section .panel-header.lipocentric{ background: #001f3f; }

  .inner-page .problem-section .panel-body{
    padding: 28px 26px 30px;
  }

  /* industry approach list */
  .inner-page .problem-section .step-list{
    display:flex;
    flex-direction: column;
  }
  .inner-page .problem-section .step{
    display:flex;
    align-items:center;
    gap: 16px;
  }
  .inner-page .problem-section .step-icon{
    width: 46px; height: 46px;
    border-radius: 50%;
    border: 0px solid #999;
    display:flex; align-items:center; justify-content:center;
    flex-shrink: 0;
    color: #444;
  }
  .inner-page .problem-section .step-icon svg{ width: 22px; height: 22px; }
  .inner-page .problem-section .step-label{
    
    font-size: 15.5px;
    font-weight: 700;
    color: #001f3f;
  }
  .inner-page .problem-section .step-arrow{
    text-align:left;
    color: #001f3f;
    font-size: 16px;
    padding: 6px 0 6px 105px;
  }

  /* lipocentric approach list */
  .inner-page .problem-section .step.gold .step-icon{ border-color: var(--accent-gold); color: var(--accent-gold); }
  .inner-page .problem-section .step.gold .step-label{ color: #001f3f;display: block;
  margin-top: 4px;
  color: #000;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.6;
  max-width: 620px;
  margin-bottom: 0px;
  font-family: var(--text-font); }
  .inner-page .problem-section .step.outcome .step-label{ color: var(--accent-gold); }
  .inner-page .problem-section .step.outcome .step-icon{ border-color: var(--accent-gold); }
  .inner-page .problem-section .plus-sign{
    text-align: left;
  color: #001f3f;
  font-size: 23px;
  padding: 0px 0 6px 103px;
  font-weight: normal;
  }

  /* middle explanation column */
  .inner-page .problem-section .explain-block{
    display:flex;
    gap: 20px;
    padding: 5px 0;
  }
  .inner-page .problem-section .explain-block + .inner-page .problem-section .explain-block{
    border-top: 1px solid #e4ddc9;
  }
  .inner-page .problem-section .explain-icon{
    width: 56px; height: 56px;
    border-radius: 50%;
    border: 0;
    display:flex; align-items:center; justify-content:center;
    flex-shrink: 0;
    color: var(--accent-gold); 
  }
  .inner-page .problem-section .step-icon .liposome-bg, 
  .inner-page .problem-section .explain-icon .liposome-bg{
  border-radius: 60px;
}
  .inner-page .problem-section .explain-icon svg{ width: 26px; height: 26px; }
  .inner-page .problem-section .explain-text{
    color: #001f3f;
    font-size: 16px;
  line-height: 1.6;
  max-width: 620px;
  margin-bottom: 10px;
  font-family: var(--text-font);
  font-weight: 400;
  }
  .inner-page .problem-section .explain-text strong{
    display: block;
  margin-top: 4px;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.5;
  max-width: 620px;
  margin-bottom: 22px;
  font-family: var(--text-font);
  color: #001f3f;
  }
  .inner-page .problem-section .middle-panel .panel-body{ padding: 6px 10px; }

  /* ---------- BOTTOM STRIP ---------- */
  .inner-page .problem-section .strip{
    background: #f5f5f5;
    padding: 34px 20px 46px;
    display:flex;
    justify-content: center;
    align-items:center;
    gap: 40px;
  }
  .inner-page .problem-section .strip-line{
    width: 90px;
    height: 1px;
    background: var(--accent-gold);
    position: relative;
  }
  .inner-page .problem-section .strip-line::before{
    content:'';
    position:absolute;
    left: -3px; top: -2.5px;
    width: 6px; height:6px;
    border-radius: 50%;
    background: var(--accent-gold);
  }
  .inner-page .problem-section .strip-item{
    display:flex;
    align-items:center;
    gap: 16px;
  }
  .inner-page .problem-section .strip-hex{
    width: 80px; height: 80px;
    /*border: 1.4px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);*/
    display:flex; align-items:center; justify-content:center;
    background: var(--white);
    border:0;
  }
  .inner-page .problem-section .strip-hex .liposomebg {
  border: 0;
}
  .inner-page .problem-section .strip-hex svg{ width: 26px; height: 26px; }
  .inner-page .problem-section .strip-text{
    
    line-height: 1.3;
  }
  .inner-page .problem-section .strip-text .b1{ font-size: 17px; font-weight: 700; color: #000; display:block; }
  .inner-page .problem-section .strip-text .b2{ font-size: 17px; font-weight: 700; color: var(--accent-gold); display:block; }


  
  .inner-page .journey-section{
    position: relative;
  background: transparent;
  background: #f2eeec;
  padding: 0 0px 0;
  }

  .inner-page .journey-section .journey-inner{
    max-width: 1320px;
    margin: 0 auto;
    max-width: 100%;
  margin: 0 auto;
  }

  /* ---------- TOP: photo + header ---------- */
  .inner-page .journey-section .top-grid{
    display: flex;
  grid-template-columns: 340px 1fr;
  gap: 48px;
  margin-bottom: 0;
  justify-content: start;
  position: relative;
  overflow: hidden;
  }

.inner-page .journey-section .portrait-col {
  position: absolute;
  right: -5px;
  top: 0;
  height: 100%;
  width: 22%; 
}
.inner-page .journey-section .portrait-col .image > img {
  height: auto;
  object-fit: cover;
  max-width: 100%;
  mix-blend-mode: normal;
}
  .inner-page .journey-section .molecule-deco{
    position: absolute;
    top: -30px;
    left: -30px;
    width: 160px;
    opacity: 0.5;
    z-index: 0;
  }
  .inner-page .journey-section .cluster-deco{
    position: absolute;
    bottom: -20px;
    left: -20px;
    width: 200px;
    opacity: 0.65;
    z-index: 0;
  }
  .inner-page .journey-section .portrait-frame{
    position: relative;
    z-index: 1;
    width: 100%;
    height: 460px;
    overflow: hidden;
    filter: grayscale(1) contrast(1.05);
  }
  .inner-page .journey-section .portrait-frame img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 65% 20%;
    -webkit-mask-image: linear-gradient(to bottom, black 78%, transparent 100%);
    mask-image: linear-gradient(to bottom, black 78%, transparent 100%);
  }

  .inner-page .journey-section .founder-id{
    position: relative;
    z-index: 2;
    text-align: center;
    margin-top: 8px;
  }
  .inner-page .journey-section .founder-id .hex{
    width: 34px; height: 34px;
    border: 1.3px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display:flex; align-items:center; justify-content:center;
    margin: 0 auto 10px;
    font-size: 15px;
    color: #001f3f;
  } 
  .inner-page .journey-section .founder-id .name{
    font-size: 26px;
    letter-spacing: 2px;
    font-weight: 700;
    color: #001f3f;
  }
  .inner-page .journey-section .founder-id .role{
    
    font-size: 11px;
    letter-spacing: 2.5px;
    color: var(--accent-gold);
    margin-top: 4px;
    font-weight: 700;
  }

  /* header text */
  .inner-page .journey-section .header-col {
  display: flex;
  flex-direction: column;
  width: 72%;
  padding: 100px 0 100px calc(9% - 100px);
}
  .inner-page .journey-section .eyebrow-row{
    display:flex;
    flex-direction: column;
    align-items:center;
    gap: 12px;
    margin-bottom: 0px;
  }
  .inner-page .journey-section .eyebrow{
    
    font-size: 13px;
    letter-spacing: 4px;
    font-weight: 700;
    color: var(--accent-gold);
  }
  .inner-page .journey-section .hex-divider{ display:flex; align-items:center; gap: 10px; }
  .inner-page .journey-section .hex-divider .rule{ width: 90px; height: 1px; background: var(--line); }
  .inner-page .journey-section .hex-divider .hex{
    width: 22px; height: 22px;
    border: 1.2px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display:flex; align-items:center; justify-content:center;
    font-size: 10px; color: var(--accent-gold);
  }

  .inner-page .journey-section .headline{
    text-align: center;
    font-size: 38px;
    line-height: 1.25;
    font-weight: 700;
    color: #001f3f;
    margin-bottom: 20px;
  }
  .inner-page .journey-section .headline .accent{ color: var(--accent-gold); }

  .inner-page .journey-section .lede{
    text-align: center;
      font-size: 14.5px;
      line-height: 1.5;
      color: #001f3f;
      max-width: 620px;
      margin: 0 auto;
      font-family: var(--text-font);
      padding-bottom: 30px;
      font-weight: normal;
  }

  /* ---------- STEPS ROW ---------- */
  .inner-page .journey-section .steps-row{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    position: relative;
    margin-bottom: 40px;
  }

  .inner-page .journey-section .step{
    position: relative;
    padding: 0 22px;
    display: flex;
    flex-direction: column;
  }
  .inner-page .journey-section .step:not(:first-child){
    border-left: 1px solid #ddd5be;
  }

  .inner-page .journey-section .step-top{
    display:flex;
    align-items:center;
    gap: 14px;
    margin-bottom: 16px;
  }
  .inner-page .journey-section .step-num{
    width: 30px; height: 30px;
    background: #001f3f;
    color: #fff;
    
    font-size: 12px;
    font-weight: 700;
    display:flex; align-items:center; justify-content:center;
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    flex-shrink: 0;
  }
  .inner-page .journey-section .step-icon{
    width: 56px; height: 56px;
    border-radius: 50%;
    border: 1.4px solid var(--accent-gold);
    display:flex; align-items:center; justify-content:center;
    flex-shrink: 0;
    background: #fff;
  }
  .inner-page .journey-section .step-icon svg{ width: 26px; height: 26px; }

  .inner-page .journey-section .step-title{
    font-size: 16.5px;
    font-weight: 700;
    color: var(--text-dark);
    line-height: 1.3;
    margin-bottom: 12px;
  }
  .inner-page .journey-section .step-text{
    
    font-size: 12.8px;
    line-height: 1.5;
    color: var(--text-body);
    font-weight: normal;
  }
  .inner-page .journey-section .step-text p + p{ margin-top: 10px; }
  .inner-page .journey-section .step-text strong{ color: var(--text-dark); }

  .inner-page .journey-section .quote-callout{
    background: #eeeae0;
    border-left: 3px solid var(--accent-gold);
    padding: 12px 14px;
    margin: 12px 0;
    
    font-style: italic;
    font-size: 13px;
    line-height: 1.55;
    color: var(--text-dark);
    position: relative;
  }
  .inner-page .journey-section .quote-callout .qmark{
    color: var(--accent-gold);
    font-size: 20px;
    font-weight: 700;
    margin-right: 4px;
  }

  /* ---------- BOTTOM STRIP ---------- */
  .inner-page .journey-section .bottom-strip{
    border-top: 1px solid #ddd5be;
    padding: 34px 20px 40px;
    text-align: center;
    position: relative;
  }
  .inner-page .journey-section .bottom-strip-icons{
    display:flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
    margin-bottom: 10px;
    position: relative;
  }
  .inner-page .journey-section .strip-icon{
    width: 62px; height: 62px;
    border-radius: 50%;
    border: 1.4px solid var(--accent-gold);
    display:flex; align-items:center; justify-content:center;
  }
  .inner-page .journey-section .strip-icon svg{ width: 26px; height: 26px; }

  .inner-page .journey-section .bottom-headline{
    font-size: 24px;
    font-weight: 700;
    color: var(--text-dark);
    line-height: 1.4;
    margin-bottom: 10px;
  }
  .inner-page .journey-section .bottom-headline .gold{ color: var(--accent-gold); display:block; }

  .inner-page .journey-section .bottom-hex-divider{
    display:flex;
    align-items:center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 16px;
  }
  .inner-page .journey-section .bottom-hex-divider .rule{ width: 60px; height: 1px; background: var(--line); }
  .inner-page .journey-section .bottom-hex-divider .hex{
    width: 20px; height: 20px;
    border: 1.2px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display:flex; align-items:center; justify-content:center;
    font-size: 9px; color: var(--accent-gold);
  }

  .inner-page .journey-section .bottom-text{
    
    font-size: 14px;
    line-height: 1.6;
    color: #001f3f;
    max-width: 640px;
    margin: 0 auto;
  }
  .inner-page .journey-section .bottom-text em{ font-style: italic; color: var(--text-dark); }
  
  
  .inner-page .influences-section {
    position: relative;
    overflow: hidden;
    /*background:
      radial-gradient(circle at 92% 10%, rgba(179,130,47,0.10), transparent 45%),
      radial-gradient(circle at 4% 8%, rgba(179,130,47,0.10), transparent 40%),
      #f8f2e6;*/
      background:#faf5ef;
    padding: 70px 0px 0;
  }

  .inner-page .influences-section .influences-inner{
    max-width: 1320px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
  }

  .inner-page .influences-section .corner-deco{
    position: absolute;
    top: 0;
    width: 300px;
    opacity: 0.5;
    z-index: 0;
    pointer-events: none;
  }
  .inner-page .influences-section .corner-deco.left{ left: -20px; }
  .inner-page .influences-section .corner-deco.right{ right: -20px; }

  /* ---------- HEADER ---------- */
  .inner-page .influences-section .eyebrow-row{
    display:flex;
    justify-content:center;
    align-items:center;
    gap: 16px;
    margin-bottom: 18px;
  }
  .inner-page .influences-section .eyebrow{
    
    font-size: 13px;
    letter-spacing: 4px;
    font-weight: 700;
    color: var(--accent-gold);
  }
  .inner-page .influences-section .eyebrow-line{ width: 50px; height: 1px; background: var(--accent-gold); }

  .inner-page .influences-section .headline{
    text-align: center;
    font-size: 42px;
    font-weight: 700;
    color: var(--text-dark);
    margin-bottom: 22px;
  }

  .inner-page .influences-section .hex-divider{
    display:flex;
    align-items:center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 22px;
  }
  .inner-page .influences-section .hex-divider .rule{ width: 90px; height: 1px; background: var(--line); }
  .inner-page .influences-section .hex-divider .hex{
    width: 22px; height: 22px;
    border: 1.2px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display:flex; align-items:center; justify-content:center;
    font-size: 10px; color: var(--accent-gold);
  }

  .inner-page .influences-section .lede{
    text-align: center;
    
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--text-body);
    max-width: 900px;
    margin: 0 auto 40px;
  }

  /* ---------- THREE CARDS ---------- */
  .inner-page .influences-section .cards{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    border: 0px solid var(--line);
    border-radius: 0px;
    background: var(--white);
    overflow: hidden;
    margin-bottom: 26px;
  }

  .inner-page .influences-section .card{
    padding: 20px 20px 32px;
  border: 1px solid #e4c3a0;
  border-radius: 10px;
  }
  .inner-page .influences-section .card:not(:first-child){
  
  }

  .inner-page .influences-section .card-head{
    display:flex;
    align-items:start;
    gap: 18px;
    margin-bottom: 14px;
    min-height: 255px;
  }
  .inner-page .influences-section .card-head .hex {
  display: none;
}
  .inner-page .influences-section .avatar{
    width: 38%;
  height: auto;
  border-radius: 0;
  border: 0;
  flex-shrink: 0;
  margin-top: -8px;
  }
  .inner-page .influences-section .avatar img{ width:100%; height:100%; object-fit: cover;border-radius: 0;border: 0; box-shadow: 0; margin: 0; }

  .inner-page .influences-section .card-name{
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--text-dark);
  }

  .inner-page .influences-section .card-hex-divider{
    display:flex;
    align-items:center;
    gap: 8px;
    margin: 10px 0 10px;
  }
  .inner-page .influences-section .card-hex-divider .rule{ width: 46px; height: 1px; background: var(--line); }
  .inner-page .influences-section .card-hex-divider .hex{
    width: 16px; height: 16px;
    border: 1px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  }

  .inner-page .influences-section .card-affiliation{
    
    font-weight: 700;
    font-style: italic;
    color: var(--accent-gold);
    font-size: 15px;
    margin-bottom: 8px;
    line-height: 1.35;
  }

  .inner-page .influences-section .card-role{
    font-size: 13px;
  line-height: 1.5;
  color: var(--text-body);
  font-weight: normal;
  }
  .inner-page .influences-section .card-role em{ font-style: italic; }

  .inner-page .influences-section .card-fields{
    
    font-size: 13px;
  line-height: 1.5;
  color: var(--text-dark);
  margin-bottom: 14px;
  font-weight: normal;
  }

  .inner-page .influences-section .card-rule{
    height: 1px;
    background: var(--line);
    margin: 14px 0 16px;
  }

  .inner-page .influences-section .card-sub{
    text-align: left;
    font-size: 12px;
    letter-spacing: 1px;
    font-weight: 700;
    color: var(--accent-gold);
    margin-bottom: 12px;
  }

  .inner-page .influences-section .card-body{
    font-weight: normal;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--text-body);
  }
  .card-body p + p{ margin-top: 10px; }
  .card-body strong{ color: var(--text-dark); }

  /* ---------- DNA BANNER ---------- */
  .inner-page .influences-section .dna-banner{
    position: relative;
  display: grid;
  grid-template-columns: .8fr 1fr;
  align-items: center;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 50px;
  justify-content: center;
  }

  .inner-page .influences-section .dna-visual{
    position: relative;
    height: 100%;
    min-height: 150px;
    background: linear-gradient(120deg, #163a5c 0%, #2f6a94 55%, #eef4f6 100%);
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .inner-page .influences-section .dna-visual svg{ width: 90%; height: 90%; opacity: 0.9; }

  .inner-page .influences-section .dna-message{
    display:flex;
    align-items:center;
    gap: 22px;
    padding: 22px 26px 22px 115px;
  }
  .inner-page .influences-section .dna-hex{
    width: 56px; height: 56px;
    border: 1.4px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display:flex; align-items:center; justify-content:center;
    flex-shrink: 0;
  }
  .inner-page .influences-section .dna-hex svg{ width: 26px; height: 26px; }
  .inner-page .influences-section .dna-text{
    font-size: 19px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--text-dark);
  }
  .inner-page .influences-section .dna-text .gold{ color: var(--accent-gold); display:block; }

  .inner-page .influences-section .dna-side{
    display:flex;
    align-items:center;
    gap: 22px;
    padding: 22px 26px;
    border-left: 1px solid var(--line);
  }
  .inner-page .influences-section .dna-side-text{
    font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-body);
  max-width: 340px;
  font-weight: normal;
  }
  .inner-page .influences-section .dna-side-text strong{ display:block; color: var(--text-dark); margin: 6px 0; }

  .inner-page .influences-section .seal{
    width: 96px; height: 96px;
    border-radius: 50%;
    border: 1.5px solid var(--accent-gold);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink: 0;
    position: relative;
  }
  .inner-page .influences-section .seal svg{ width: 34px; height: 34px; }
  .inner-page .influences-section .seal-text{ 
    position:absolute;
    inset: 0;
  }
  .inner-page .influences-section .seal-text svg{ width:100%; height:100%; }

  /* ---------- FOOTER BAR ---------- */
  .inner-page .influences-section .footer-bar{
    background: #001f3f;
    padding: 20px 20px;
    text-align: center;
  }
  .inner-page .influences-section .footer-list{
    
    font-size: 12.5px;
    letter-spacing: 1.5px;
    font-weight: 700;
    color: var(--white);
    display:flex;
    justify-content:center;
    align-items:center;
    gap: 18px;
    flex-wrap: wrap;
  }
  .inner-page .influences-section .footer-list .dot{ color: var(--accent-gold); }
  .inner-page .influences-section .footer-hex{
    width: 16px; height: 16px;
    border: 1px solid var(--accent-gold);
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display: inline-flex;
    margin: 8px auto 0;
  }
  
  

.inner-page .what-ds-lc-section {
  font-family: "Inter", sans-serif;
  /*background: linear-gradient(180deg, #fdfbf7 0%, #faf6ef 100%);*/
  background: #fff;
  padding: 56px 24px 70px;
  color: #1c2440;
  overflow: hidden;
}

/* ---------- Hero ---------- */
.inner-page .what-ds-lc-hero {
  position: relative;
  max-width: 1200px;
  margin: 0 auto 56px;
  padding: 20px 0 20px;
  min-height: 230px;
}

.inner-page .what-ds-lc-decor {
  position: absolute;
  top: 6px;
  width: 190px;
  height: 190px;
  border-radius: 50%;
  object-fit: cover;
  opacity: 0.9;
  filter: drop-shadow(0 10px 25px rgba(180, 140, 60, 0.15));
  pointer-events: none;
  mask-image: radial-gradient(circle, rgba(0,0,0,0.95) 60%, transparent 100%);
  -webkit-mask-image: radial-gradient(circle, rgba(0,0,0,0.95) 60%, transparent 100%);
}

.inner-page .what-ds-lc-decor-left {
  left: 10px;
}

.inner-page .what-ds-lc-decor-right {
  right: 10px;
}

.inner-page .what-ds-lc-hero-content {
  text-align: center;
  position: relative;
  z-index: 2;
}

.inner-page .what-ds-lc-eyebrow {
  font-family: "Inter", sans-serif;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 4px;
  color: #c08a34;
  margin: 0 0 6px;
}

.inner-page .what-ds-lc-title {
  font-family: "Playfair Display", serif;
  font-weight: 700;
  font-size: clamp(25px, 3vw, 50px);
  letter-spacing: 3px;
  color: #16213e;
  margin: 0 0 8px;
  line-height: 1.05;
}

.inner-page .what-ds-lc-mean-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-bottom: 22px;
}

.inner-page .what-ds-lc-line {
  width: 46px;
  height: 1px;
  background: #c08a34;
  display: inline-block;
}

.inner-page .what-ds-lc-mean {
  font-family: "Playfair Display", serif;
  font-weight: 600;
  font-size: clamp(20px, 2.6vw, 30px);
  letter-spacing: 3px;
  color: #c08a34;
}

.inner-page .what-ds-lc-subtitle {
  font-weight: 500;
  font-size: clamp(16px, .9vw, 21px);
  color: #2a3358;
  margin: 0 auto;
  max-width: 620px;
  font-size: 16px;
  font-weight: normal;
}

/* ---------- Blocks row ---------- */
.inner-page .what-ds-lc-blocks {
  max-width: 1300px;
  margin: 0 auto 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  flex-wrap: wrap;
}

.inner-page .what-ds-lc-block {
  display: flex;
  align-items: center;
  gap: 22px;
  flex: 1 1 300px;
  min-width: 280px;
}

.inner-page .what-ds-lc-block-circle {
  flex: 0 0 auto;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  overflow: hidden;
  border: 0;
  box-shadow: none;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.inner-page .what-ds-lc-block-circle:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 14px 30px rgba(24, 32, 60, 0.18);
}

.inner-page .what-ds-lc-block-circle img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.inner-page .what-ds-lc-block-content {
  flex: 1 1 auto;
}

.inner-page .what-ds-lc-block-heading {
  font-family: "Playfair Display", serif;
  font-weight: 700;
  font-size: 26px;
  letter-spacing: 2px;
  color: #c08a34;
  margin: 0 0 8px;
}

.inner-page .what-ds-lc-block-underline {
  display: block;
  width: 36px;
  height: 2px;
  background: #c08a34;
  margin-bottom: 14px;
}

.inner-page .what-ds-lc-block-body {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.inner-page .what-ds-lc-block-icon {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1.5px solid #d9b877;
  background: #fbf3e6;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #c08a34;
}

.inner-page .what-ds-lc-block-text {
  font-size: 15px;
  line-height: 1.3;
  color: #313a5c;
  margin: 0;
  font-weight: normal;
}

.inner-page .what-ds-lc-block-text strong {
  color: #16213e;
  font-weight: 700;
}

.inner-page .what-ds-lc-plus {
  font-family: "Playfair Display", serif;
  font-size: 30px;
  color: #d9b877;
  flex: 0 0 auto;
  padding: 0 4px;
}

/* ---------- Quote ---------- */
.inner-page .what-ds-lc-quote-wrap {
  max-width: 1080px;
  margin: 0 auto 40px;
}

.inner-page .what-ds-lc-quote-box {
  background: #ffffff;
  border: 1px solid #eee2cd;
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(24, 32, 60, 0.06);
  padding: 30px 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  text-align: center;
  flex-wrap: wrap;
    background: linear-gradient(180deg, #fdfbf7 0%, #faf6ef 100%);
}

.inner-page .what-ds-lc-quote-mark {
  font-family: "Playfair Display", serif;
  font-size: 46px;
  color: #c08a34;
  line-height: 0;
  transform: translateY(6px);
}

.inner-page .what-ds-lc-quote-text {
  font-family: "Playfair Display", serif;
  font-weight: 600;
  font-size: clamp(18px, 2.4vw, 26px);
  color: #16213e;
  margin: 0;
  /*max-width: 720px;*/
}

.inner-page .what-ds-lc-quote-highlight {
  color: #c08a34;
}

.inner-page .what-ds-lc-quote-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 18px;
}

.inner-page .what-ds-lc-quote-divider-line {
  width: 60px;
  height: 1px;
  background: #d9b877;
}

.inner-page .what-ds-lc-quote-divider-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #c08a34;
}

/* ---------- Footer items ---------- */
.inner-page .what-ds-lc-footer {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 28px;
}

.inner-page .what-ds-lc-footer-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  flex: 1 1 220px;
  min-width: 220px;
}

.inner-page .what-ds-lc-footer-icon {
  flex: 0 0 auto;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 1.5px solid #d9b877;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #c08a34;
  background: #fffdf9;
}

.inner-page .what-ds-lc-footer-title {
  font-size: 13.5px;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: #16213e;
  margin: 6px 0 4px;
}

.inner-page .what-ds-lc-footer-subtitle {
  font-size: 13.5px;
  color: #5b6280;
  margin: 0;
  line-height: 1.4;
}

.inner-page .what-ds-lc-footer-divider {
  width: 1px;
  align-self: stretch;
  background: #e5dcc7;
  flex: 0 0 auto;
}


.inner-page .lipid-section {
  max-width: 1400px;
  margin: 0 auto;
  padding: 60px 24px 80px;
  max-width: 100%;
  margin: 0 auto;
  padding: 60px 24px 80px;
  position: relative;
  background: #fefefd;
}
.wrap {
  max-width: 1320px;
  margin: auto;
  position: relative;
}


.image.section-right-img {
  position: absolute;
  right: 0;
  top: 0;
}
.wrap {
  max-width: 1320px;
  margin: auto;
  position: relative;
}
.image.section-right-img .liposomebg {
  border: 0;
  border-radius: 0;
  /*! max-width: 710px; */
}
/* ---------- Top block ---------- */
.inner-page .lipid-section .lipid-top {
  display: flex;
  align-items: center;
  gap: 60px;
  margin-bottom: 50px;
}

.inner-page .lipid-section .lipid-text {
  flex: 1 1 45%;
}

.inner-page .lipid-section .eyebrow {
  color: #c08a34;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  margin-bottom: 10px;
}

.inner-page .lipid-section .eyebrow::after {
  content: '';
  display: block;
  width: 34px;
  height: 2px;
  background: #c08a34;
  margin-top: 12px;
}

.inner-page .lipid-section .lipid-text h2 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: clamp(36px, 5vw, 52px);
  line-height: 1.3;
  color: #16213e;
  margin-bottom: 10px;
}

.inner-page .lipid-section .lipid-text p {
  font-size: 16px;
  line-height: 1.5;
  color: #4a5170;
  margin-bottom: 10px;
  max-width: 480px;
  font-weight: normal;
  letter-spacing: 0;
}

.inner-page .lipid-section .lipid-graphic {
  position: relative;
  flex: 1 1 45%;
  height: 320px;
  border-radius: 20px;
  background: linear-gradient(135deg, #efe6d3 0%, #f7f0e2 60%, #fdfbf7 100%);
  overflow: hidden;
}

.inner-page .lipid-section .bubble {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff6da, #d9a94a 65%, #a9762a);
  box-shadow: inset 0 4px 10px rgba(255,255,255,0.6), 0 6px 14px rgba(150,110,30,0.25);
}

.inner-page .lipid-section .bubble-1 { width: 130px; height: 130px; top: 40px; right: 60px; }
.inner-page .lipid-section .bubble-2 { width: 70px; height: 70px; top: 20px; right: 210px; }
.inner-page .lipid-section .bubble-3 { width: 44px; height: 44px; top: 150px; right: 40px; }
.inner-page .lipid-section .bubble-4 { width: 90px; height: 90px; bottom: 30px; right: 140px; }
.inner-page .lipid-section .bubble-5 { width: 28px; height: 28px; top: 100px; right: 260px; }
.inner-page .lipid-section .bubble-6 { width: 55px; height: 55px; bottom: 50px; left: 40px; opacity: .6; }

/* ---------- Philosophy box ---------- */
.inner-page .lipid-section .philosophy-box {
  display: flex;
  align-items: center;
  gap: 30px;
  background: #f6f2ea;
  border-radius: 16px;
  padding: 30px 36px;
  margin-bottom: 50px;
}

.inner-page .lipid-section .philosophy-left {
  display: flex;
  align-items: center;
  gap: 22px;
  flex: 1 1 45%;
}

.inner-page .lipid-section .divider {
  width: 1px;
  align-self: stretch;
  background: #ddd3ba;
}

.inner-page .lipid-section .philosophy-right {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.inner-page .lipid-section .icon-circle {
  flex: 0 0 auto;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: 0px solid #c08a34;
  color: #c08a34;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid;
}
.inner-page .lipid-section .icon-circle .liposomebg {
  border: 0;
  border-radius: 70px;
}

.inner-page .lipid-section .icon-circle svg {
  width: 26px;
  height: 26px;
}

.inner-page .lipid-section .philosophy-left p {
  font-family: 'Playfair Display', serif;
  font-size: 22px;
  font-weight: 600;
  color: #16213e;
  line-height: 1.35;
}

.inner-page .lipid-section .highlight {
  color: #c08a34;
}

.inner-page .lipid-section .check-item {
  display: flex;
  align-items: center;
  gap: 14px;
}

.inner-page .lipid-section .check-item svg {
  width: 22px;
  height: 22px;
  color: #c08a34;
  flex: 0 0 auto;
}

.inner-page .lipid-section .check-item p {
  font-size: 15px;
  color: #333c58;
}

/* ---------- Features row ---------- */
.inner-page .lipid-section .features-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 50px;
}

.inner-page .lipid-section .feature {
  flex: 1 1 22%;
  text-align: center;
  padding: 0 8px;
}

.inner-page .lipid-section .feature-icon {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: #f6f2ea;
  color: #c08a34;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  border: 0px solid #c08a34;
}

.inner-page .lipid-section .feature-icon svg {
  width: 28px;
  height: 28px;
}

.inner-page .lipid-section .feature h3 {
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 1px;
  color: #d3933e;
  margin-bottom: 0;
  font-family: var(--text-font);
}

.inner-page .lipid-section .feature p {
  font-size: 14px;
  line-height: 1.55;
  color: #4a5170;
}

.inner-page .lipid-section .v-divider {
  width: 1px;
  align-self: stretch;
  background: #e5dcc7;
  margin-top: 10px;
}

/* ---------- Dark box ---------- */
.inner-page .lipid-section .dark-box {
  background: #16213e;
  border-radius: 20px;
  padding: 34px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  flex-wrap: wrap;
}

.inner-page .lipid-section .dark-left {
  display: flex;
  align-items: center;
  gap: 22px;
  flex: 1 1 50%;
}

.inner-page .lipid-section .dark-left p {
  color: #fff;
  font-size: 19px;
  line-height: 1.5;
  font-weight: 500;
  max-width: 460px;
}

.inner-page .lipid-section .icon-circle.dark {
  border-color: #c08a34;
  color: #c08a34;
}

.inner-page .lipid-section .icon-circle.dark.small {
  width: 44px;
  height: 44px;
}

.inner-page .lipid-section .icon-circle.dark.small svg {
  width: 20px;
  height: 20px;
}

.inner-page .lipid-section .dark-right {
  display: flex;
  align-items: center;
  gap: 34px;
  flex-wrap: wrap;
}

.inner-page .lipid-section .dark-item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.inner-page .lipid-section .dark-item span {
  color: #fff;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.5px;
  max-width: 90px;
  line-height: 1.3;
}



.inner-page .why-section {
  max-width: 1440px;
  margin: 0 auto;
  padding: 60px 24px 80px;
  position: relative;
  max-width: 100%;
  background: #f9f3ee;
}

/* ---------- Top block ---------- */
.inner-page .why-section .why-top {
  display: flex;
  align-items: center;
  gap: 60px;
  margin-bottom: 50px;
}

.inner-page .why-section .why-text {
  flex: 1 1 45%;
}

.inner-page .why-section .eyebrow {
  color: #c08a34;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  margin-bottom: 10px;
}

.inner-page .why-section .why-text h2 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: clamp(32px, 4.4vw, 46px);
  line-height: 1.2;
  color: #16213e;
  margin-bottom: 18px;
}

.inner-page .why-section .why-text > .eyebrow + h2 {
  margin-top: 4px;
}

.inner-page .why-section .why-text h2 + p {
  margin-top: 4px;
}

.inner-page .why-section .why-text::after {
  content: none;
}

.inner-page .why-section .why-text p {
  font-size: 16px;
  line-height: 1.6;
  color: #4a5170;
  margin-bottom: 6px;
  max-width: 480px;
}

.inner-page .why-section .why-text p strong {
  color: #333c58;
}

.inner-page .why-section .eyebrow {
  position: relative;
}

.inner-page .why-section .eyebrow::after {
  content: '';
  display: block;
  width: 34px;
  height: 2px;
  background: #c08a34;
  margin: 12px 0 16px;
}

/* ---------- Graphic ---------- */
.inner-page .why-section .why-graphic {
  position: relative;
  flex: 1 1 45%;
  height: 300px;
  border-radius: 20px;
  background: linear-gradient(135deg, #f7ecd8 0%, #fbf5e8 60%, #fdfbf7 100%);
  overflow: hidden;
}

.inner-page .why-section .capsule {
  position: absolute;
  top: 40px;
  right: 40px;
  width: 170px;
  height: 60px;
  border-radius: 30px;
  background: linear-gradient(120deg, rgba(255,255,255,0.6), rgba(215,170,90,0.5));
  border: 2px solid rgba(200,150,60,0.5);
  transform: rotate(20deg);
}

.inner-page .why-section .jbubble {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff6da, #d9a94a 65%, #a9762a);
  box-shadow: inset 0 3px 8px rgba(255,255,255,0.6), 0 6px 12px rgba(150,110,30,0.25);
}

.inner-page .why-section .jb-1 { width: 90px; height: 90px; top: 60px; left: 60px; }
.inner-page .why-section .jb-2 { width: 46px; height: 46px; top: 130px; left: 150px; }
.inner-page .why-section .jb-3 { width: 30px; height: 30px; top: 190px; left: 90px; }
.inner-page .why-section .jb-4 { width: 60px; height: 60px; bottom: 40px; left: 220px; }
.inner-page .why-section .jb-5 { width: 20px; height: 20px; top: 100px; left: 230px; }
.inner-page .why-section .jb-6 { width: 38px; height: 38px; bottom: 60px; left: 320px; opacity: .8; }

/* ---------- Path boxes ---------- */
.inner-page .why-section .path-box {
  border-radius: 16px;
  padding: 26px 30px;
  margin-bottom: 24px;
}

.inner-page .why-section .light-box {
  background: #f7f3ec;
  border: 1px solid #ece3cd;
}

.inner-page .why-section .dark-box {
  background: #010e1f;
}

.inner-page .why-section .path-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: #16213e;
  margin-bottom: 26px;
}

.inner-page .why-section .path-title.gold {
  color: #c9974a;
}

.inner-page .why-section .path-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 6px;
}

.inner-page .why-section .path-item {
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
}

.inner-page .why-section .path-circle {
  width: 82px;
  height: 82px;
  border-radius: 50%;
  border: 1.5px solid #d9c9a0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 14px;
  background: #fff;
}

.inner-page .why-section .path-circle.grey {
  color: #9a9fb3;
  border-color: #d8d4c8;
}

.inner-page .why-section .path-circle.grey.filled {
  background: #e7e5df;
  color: #9a9fb3;
  font-size: 26px;
  font-weight: 600;
  font-family: 'Playfair Display', serif;
}

.inner-page .why-section .path-circle.gold {
  color: #c9974a;
  border-color: #c9974a;
  background: #1b2540;
}

.inner-page .why-section .path-circle svg {
  width: 30px;
  height: 30px;
}

.inner-page .why-section .dark-label {
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: #16213e;
  margin-bottom: 6px;
}

.inner-page .why-section .gold-label {
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: #c9974a;
  margin-bottom: 6px;
  font-family: var(--text-font);
}

.inner-page .why-section .path-item p {
  font-size: 13px;
  line-height: 1.4;
  color: #5b6280;
  max-width: 140px;
  margin: 0 auto;
  
}

.inner-page .why-section .dark-box .path-item p {
  color: #b9bfd6;
}

.inner-page .why-section .chevron {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  margin-top: 30px;
}

.inner-page .why-section .chevron.grey {
  color: #c9974a;
}

.inner-page .why-section .chevron.gold {
  color: #c9974a;
}

/* ---------- Quote box ---------- */
.inner-page .why-section .quote-box {
  display: flex;
  align-items: center;
  gap: 20px;
  background: #f7f3ec;
  border: 1px solid #ece3cd;
  border-radius: 16px;
  padding: 26px 34px;
}

.inner-page .why-section .icon-circle {
  flex: 0 0 auto;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 1.5px solid #c08a34;
  color: #c08a34;
  display: flex;
  align-items: center;
  justify-content: center;
}

.inner-page .why-section .icon-circle svg {
  width: 24px;
  height: 24px;
}

.inner-page .why-section .quote-box p {
  font-size: 17px;
  line-height: 1.6;
  color: #16213e;
}

.inner-page .why-section .quote-box .highlight {
  color: #c08a34;
  font-weight: 600;
}
  
  


.inner-page .future-section {
  max-width: 100%;
  margin: 0 auto;
  padding: 50px 0px 20px;
  position: relative;
  background: #fefdfc;
}

.inner-page .future-section .gold-text {
  color: #c08a34;
}

/* ---------- Hero ---------- */
.inner-page .future-section .hero {
  position: relative;
  text-align: center;
  padding: 10px 0 30px;
  margin-bottom: 40px;
}

.inner-page .future-section .hero-content {
  position: relative;
  z-index: 2;
  max-width: 780px;
  margin: 0 auto;
}

.inner-page .future-section .eyebrow {
  color: #c08a34;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  margin-bottom: 14px;
}

.inner-page .future-section .hex-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-bottom: 20px;
}

.inner-page .future-section .hex-line {
  width: 40px;
  height: 1px;
  background: #c08a34;
}

.inner-page .future-section .hexagon {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
  border: 1.5px solid #c08a34;
  color: #c08a34;
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 13px;
}

.inner-page .future-section .hero h2 {
  font-family: 'Playfair Display', serif;
  font-weight: 600;
  font-size: clamp(28px, 3.6vw, 44px);
  line-height: 1.28;
  color: #16213e;
  margin-bottom: 20px;
}

.inner-page .future-section .hero-sub {
  font-family: 'Playfair Display', serif;
  font-size: clamp(15px, 1.6vw, 18px);
  color: #3a4265;
  line-height: 1.6;
}

.inner-page .future-section .molecule-graphic {
  position: absolute;
  top: 0;
  left: 0;
  width: 220px;
  height: 220px;
  opacity: 0.85;
}

.inner-page .future-section .molecule-graphic .node {
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff, #d9c9a0 70%, #b9a06a);
  box-shadow: 0 3px 6px rgba(150,120,60,0.25);
}

.inner-page .future-section .molecule-graphic .n1 { top: 20px; left: 30px; width: 22px; height: 22px; }
.inner-page .future-section .molecule-graphic .n2 { top: 70px; left: 90px; }
.inner-page .future-section .molecule-graphic .n3 { top: 110px; left: 40px; width: 10px; height: 10px; }
.inner-page .future-section .molecule-graphic .n4 { top: 140px; left: 130px; width: 16px; height: 16px; }
.inner-page .future-section .molecule-graphic .n5 { top: 30px; left: 150px; width: 8px; height: 8px; }

.inner-page .future-section .molecule-graphic .link {
  position: absolute;
  height: 1px;
  background: #cbb888;
  transform-origin: left center;
}

.inner-page .future-section .molecule-graphic .l1 { top: 32px; left: 42px; width: 70px; transform: rotate(25deg); }
.inner-page .future-section .molecule-graphic .l2 { top: 82px; left: 55px; width: 70px; transform: rotate(-20deg); }
.inner-page .future-section .molecule-graphic .l3 { top: 100px; left: 100px; width: 55px; transform: rotate(60deg); }
.inner-page .future-section .molecule-graphic .l4 { top: 40px; left: 100px; width: 70px; transform: rotate(-45deg); }

.inner-page .future-section .capsule-graphic {
  position: absolute;
  top: 0;
  right: 0;
  width: 260px;
  height: 220px;
  opacity: 0.95;
}

.inner-page .future-section .capsule-graphic .capsule {
  position: absolute;
  top: 20px;
  right: 30px;
  width: 150px;
  height: 55px;
  border-radius: 28px;
  background: linear-gradient(120deg, rgba(255,255,255,0.7), rgba(215,170,90,0.55));
  border: 2px solid rgba(200,150,60,0.5);
  transform: rotate(25deg);
}

.inner-page .future-section .capsule-graphic .bead {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff6da, #d9a94a 65%, #a9762a);
  box-shadow: inset 0 3px 6px rgba(255,255,255,0.6), 0 4px 10px rgba(150,110,30,0.25);
}

.inner-page .future-section .capsule-graphic .b1 { width: 46px; height: 46px; top: 90px; right: 170px; }
.inner-page .future-section .capsule-graphic .b2 { width: 26px; height: 26px; top: 140px; right: 210px; }
.inner-page .future-section .capsule-graphic .b3 { width: 16px; height: 16px; top: 170px; right: 160px; }
.inner-page .future-section .capsule-graphic .b4 { width: 34px; height: 34px; top: 150px; right: 100px; }
.inner-page .future-section .capsule-graphic .b5 { width: 12px; height: 12px; top: 110px; right: 130px; }
.inner-page .future-section .capsule-graphic .b6 { width: 20px; height: 20px; top: 185px; right: 210px; opacity: .8; }

/* ---------- Standards ---------- */
.inner-page .future-section .standards-block {
  margin-bottom: 50px;
}

.inner-page .future-section .section-eyebrow {
  color: #c08a34;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 2px;
  margin-bottom: 10px;
  position: relative;
  text-align: left;
}

.inner-page .future-section .section-eyebrow::after {
  content: '';
  display: block;
  width: 34px;
  height: 2px;
  background: #c08a34;
  margin-top: 12px;
}

.inner-page .future-section .standards-row {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin-top: 30px;
}

.inner-page .future-section .standard-item {
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
  padding: 0 10px;
}

.inner-page .future-section .standard-icon {
  width: 74px;
  height: 74px;
  border-radius: 50%;
  border: 1.5px solid #c9974a;
  color: #c08a34;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
}

.inner-page .future-section .standard-icon svg {
  width: 30px;
  height: 30px;
}

.inner-page .future-section .standard-item h3 {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.5px;
  color: #16213e;
  margin-bottom: 10px;
  line-height: 1.4;
}

.inner-page .future-section .standard-item p {
  font-size: 13.5px;
  line-height: 1.55;
  color: #5b6280;
}

.inner-page .future-section .s-divider {
  width: 1px;
  align-self: stretch;
  background: #e5dcc7;
  margin-top: 8px;
}

/* ---------- Journey card ---------- */
.inner-page .future-section .journey-card {
  background: #fff;
  border: 1px solid #ece3cd;
  border-radius: 20px;
  padding: 34px 36px;
  margin-bottom: 40px;
}

.inner-page .future-section .journey-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 28px;
}

.inner-page .future-section .journey-header-text h2 {
  font-family: 'Playfair Display', serif;
  font-weight: 600;
  font-size: clamp(20px, 2.4vw, 28px);
  color: #16213e;
  margin-bottom: 10px;
}

.inner-page .future-section .journey-header-text p {
  font-size: 15px;
  color: #4a5170;
  margin-bottom: 4px;
}

.inner-page .future-section .journey-header .molecule-graphic.small {
  position: relative;
  width: 220px;
  height: 100px;
  flex: 0 0 auto;
}

.inner-page .future-section .journey-header .molecule-graphic.small .node {
  width: 14px;
  height: 14px;
}

.inner-page .future-section .journey-header .molecule-graphic.small .n1 { top: 40px; left: 10px; }
.inner-page .future-section .journey-header .molecule-graphic.small .n2 { top: 10px; left: 100px; width: 20px; height: 20px; }
.inner-page .future-section .journey-header .molecule-graphic.small .n3 { top: 55px; left: 170px; width: 26px; height: 26px; }
.inner-page .future-section .journey-header .molecule-graphic.small .l1 { top: 46px; left: 22px; width: 90px; transform: rotate(-18deg); }
.inner-page .future-section .journey-header .molecule-graphic.small .l2 { top: 25px; left: 110px; width: 70px; transform: rotate(20deg); }

.inner-page .future-section .journey-columns {
  display: flex;
  align-items: stretch;
  gap: 22px;
}

.inner-page .future-section .path-box {
  border-radius: 14px;
  padding: 22px 20px;
}

.inner-page .future-section .path-box.traditional {
  flex: 0 1 42%;
  background: #f7f3ec;
  border: 1px solid #ece3cd;
}

.inner-page .future-section .path-box.nutra {
  flex: 1 1 58%;
  background: #fdfaf3;
  border: 1px solid #ece3cd;
}

.inner-page .future-section .path-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #16213e;
  margin-bottom: 22px;
}

.inner-page .future-section .path-title.gold {
  color: #c9974a;
}

.inner-page .future-section .path-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 4px;
}

.inner-page .future-section .path-item {
  flex: 1 1 0;
  min-width: 0;
  text-align: center;
}

.inner-page .future-section .path-circle {
  width: 62px;
  height: 62px;
  border-radius: 50%;
  border: 1.5px solid #d9c9a0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 12px;
  background: #fff;
}

.inner-page .future-section .path-circle.grey {
  color: #9a9fb3;
  border-color: #d8d4c8;
}

.inner-page .future-section .path-circle.grey.filled {
  background: #e7e5df;
  color: #9a9fb3;
  font-size: 22px;
  font-weight: 600;
  font-family: 'Playfair Display', serif;
}

.inner-page .future-section .path-circle.gold {
  color: #c9974a;
  border-color: #c9974a;
}

.inner-page .future-section .path-circle svg {
  width: 24px;
  height: 24px;
}

.inner-page .future-section .path-item h4 {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4px;
  color: #16213e;
  margin-bottom: 4px;
}

.inner-page .future-section .path-item h4.gold-label {
  color: #c9974a;
}

.inner-page .future-section .path-item p {
  font-size: 11.5px;
  line-height: 1.35;
  color: #5b6280;
  max-width: 100px;
  margin: 0 auto;
}

.inner-page .future-section .chevron {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  margin-top: 22px;
  color: #c9974a;
}

/* ---------- Quote box ---------- */
.inner-page .future-section .quote-box {
  display: flex;
  align-items: center;
  gap: 20px;
  background: #f7f3ec;
  border: 1px solid #ece3cd;
  border-radius: 16px;
  padding: 24px 32px;
}

.inner-page .future-section .icon-circle {
  flex: 0 0 auto;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1.5px solid #c08a34;
  color: #c08a34;
  display: flex;
  align-items: center;
  justify-content: center;
}

.inner-page .future-section .icon-circle svg {
  width: 22px;
  height: 22px;
}

.inner-page .future-section .quote-box p {
  font-size: 16px;
  line-height: 1.6;
  color: #16213e;
} 


.inner-page .philosophy-section {
  position: relative;
  margin: 0 auto;
  padding: 40px 0px 0;
  background: linear-gradient(135deg, #f4e9d6 0%, #faf3e6 40%, #fdfbf7 70%);
  overflow: hidden;
}

.inner-page .philosophy-section .gold-text {
  color: #c08a34;
}
.inner-page .philosophy-section .wrap {
  max-width: 1320px;
  margin: auto;
}
.inner-page .philosophy-section .gold-text sup {
  font-size: 18px;
}
/* ---------- Background decor ---------- */
.inner-page .philosophy-section .bg-molecule, .inner-page .philosophy-section .bg-helix {
  position: absolute;
  pointer-events: none;
  opacity: 0.55;
}

.inner-page .philosophy-section .bg-molecule {
  top: 0;
  left: 0;
  width: 320px;
  height: 320px;
}

.inner-page .philosophy-section .bg-molecule .node {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff, #d9c9a0 70%, #b9a06a);
}

.inner-page .philosophy-section .bg-molecule .n1 { top: 30px; left: 40px; width: 30px; height: 30px; }
.inner-page .philosophy-section .bg-molecule .n2 { top: 90px; left: 110px; width: 16px; height: 16px; }
.inner-page .philosophy-section .bg-molecule .n3 { top: 150px; left: 50px; width: 12px; height: 12px; }
.inner-page .philosophy-section .bg-molecule .n4 { top: 190px; left: 150px; width: 20px; height: 20px; }
.inner-page .philosophy-section .bg-molecule .n5 { top: 240px; left: 90px; width: 10px; height: 10px; }
.inner-page .philosophy-section .bg-molecule .n6 { top: 60px; left: 200px; width: 8px; height: 8px; }

.inner-page .philosophy-section .bg-molecule .link {
  position: absolute;
  height: 1px;
  background: #cbb888;
  transform-origin: left center;
}

.inner-page .philosophy-section .bg-molecule .l1 { top: 44px; left: 55px; width: 90px; transform: rotate(28deg); }
.inner-page .philosophy-section .bg-molecule .l2 { top: 100px; left: 65px; width: 90px; transform: rotate(-25deg); }
.inner-page .philosophy-section .bg-molecule .l3 { top: 160px; left: 65px; width: 100px; transform: rotate(15deg); }
.inner-page .philosophy-section .bg-molecule .l4 { top: 200px; left: 105px; width: 70px; transform: rotate(50deg); }
.inner-page .philosophy-section .bg-molecule .l5 { top: 70px; left: 115px; width: 100px; transform: rotate(-10deg); }

.inner-page .philosophy-section .bg-helix {
  top: 20px;
  right: 0;
  width: 220px;
  height: 380px;
}

.inner-page .philosophy-section .bg-helix .dot {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff, #d9c9a0 70%, #b9a06a);
}

.inner-page .philosophy-section .bg-helix .d1 { top: 10px; left: 40px; }
.inner-page .philosophy-section .bg-helix .d2 { top: 45px; left: 90px; }
.inner-page .philosophy-section .bg-helix .d3 { top: 80px; left: 40px; }
.inner-page .philosophy-section .bg-helix .d4 { top: 115px; left: 100px; }
.inner-page .philosophy-section .bg-helix .d5 { top: 150px; left: 50px; }
.inner-page .philosophy-section .bg-helix .d6 { top: 185px; left: 110px; }
.inner-page .philosophy-section .bg-helix .d7 { top: 220px; left: 60px; }
.inner-page .philosophy-section .bg-helix .d8 { top: 255px; left: 120px; }
.inner-page .philosophy-section .bg-helix .d9 { top: 290px; left: 70px; }
.inner-page .philosophy-section .bg-helix .d10 { top: 325px; left: 130px; }

/* ---------- Header ---------- */
.inner-page .philosophy-section .header {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 980px;
  margin: 0 auto;
  padding-bottom: 40px;
  display: flex;
  flex-direction: column;
}

.inner-page .philosophy-section .eyebrow {
  color: #c08a34;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  margin-bottom: 16px;
}

.inner-page .philosophy-section .hex-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-bottom: 18px;
}

.inner-page .philosophy-section .hex-row.small {
  margin: 18px 0 22px;
}

.inner-page .philosophy-section .hex-line {
  width: 60px;
  height: 1px;
  background: #c08a34;
}

.inner-page .philosophy-section .hexagon {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
  border: 1.5px solid #c08a34;
  color: #c08a34;
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 13px;
}

.inner-page .philosophy-section .dot-icon {
  width: 22px;
  height: 22px;
  color: #c08a34;
  display: flex;
  align-items: center;
  justify-content: center;
}

.inner-page .philosophy-section .header h2 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: clamp(22px, 3vw, 42px);
  letter-spacing: 1px;
  color: #16213e;
  margin-bottom: 4px;
}

.inner-page .philosophy-section .header h1 sup {
  font-size: 40%;
}

.inner-page .philosophy-section .lead {
  font-size: 17px;
  line-height: 1.7;
  color: #3a4265;
  margin-bottom: 20px;
}

.inner-page .philosophy-section .lead strong {
  color: #c08a34;
}

.inner-page .philosophy-section .question-label {
  color: #c08a34;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.5px;
  margin-bottom: 10px;
}

.inner-page .philosophy-section .question {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-weight: 600;
  font-size: clamp(18px, 2.2vw, 24px);
  color: #16213e;
  margin-bottom: 20px;
}

.inner-page .philosophy-section .body-text {
  font-size: 15px;
  line-height: 1.75;
  color: #4a5170;
}

/* ---------- Pillars row ---------- */
.inner-page .philosophy-section .pillars-row {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: stretch;
  gap: 6px;
  margin-bottom: 30px;
}

.inner-page .philosophy-section .pillar-card {
  flex: 1 1 0;
  min-width: 0;
  background: #fdfbf6;
  border: 1px solid #ece3cd;
  border-radius: 14px;
  padding: 26px 18px;
  text-align: center;
}

.inner-page .philosophy-section .pillar-icon {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  border: 1.5px solid #c9974a;
  color: #b8873a;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
}

.inner-page .philosophy-section .pillar-icon svg {
  width: 28px;
  height: 28px;
}

.inner-page .philosophy-section .pillar-card h3 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 19px;
  letter-spacing: 0.5px;
  color: #16213e;
  margin-bottom: 12px;
}

.inner-page .philosophy-section .pillar-card h3 sup {
  font-size: 45%;
}

.inner-page .philosophy-section .pillar-card p {
  font-size: 13.5px;
  line-height: 1.55;
  color: #4a5170;
}

.inner-page .philosophy-section .pillar-divider {
  display: block;
  width: 34px;
  height: 1px;
  background: #d9c9a0;
  margin: 18px auto;
}

.inner-page .philosophy-section .pillar-tags {
  font-size: 12px;
  color: #333c58;
  line-height: 1.6;
}

.inner-page .philosophy-section .pillar-arrow {
  width: 22px;
  height: 22px;
  color: #c08a34;
  flex: 0 0 auto;
  align-self: center;
}

/* ---------- Banner card ---------- */
.inner-page .philosophy-section .banner-card {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 30px;
  background: #fdfbf6;
  border: 1px solid #ece3cd;
  border-radius: 16px;
  padding: 36px 40px;
  margin-bottom: 40px;
  overflow: hidden;
}

.inner-page .philosophy-section .banner-logo {
  flex: 0 0 auto;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle, rgba(200,150,60,0.12) 0%, transparent 70%);
}

.inner-page .philosophy-section .hexagon.large {
  width: 56px;
  height: 56px;
  font-size: 22px;
}

.inner-page .philosophy-section .banner-text {
  flex: 1 1 auto;
  text-align: center;
}

.inner-page .philosophy-section .banner-text h2 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: clamp(22px, 2.8vw, 32px);
  color: #16213e;
  margin-bottom: 4px;
}

.inner-page .philosophy-section .banner-text p {
  font-size: 15px;
  line-height: 1.7;
  color: #4a5170;
  max-width: 640px;
  margin: 0 auto;
}

.inner-page .philosophy-section .banner-bubbles {
  position: relative;
  flex: 0 0 auto;
  width: 160px;
  height: 130px;
}

.inner-page .philosophy-section .bb {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff, #e6d6b0 70%, #cbb583);
  opacity: 0.85;
}

.inner-page .philosophy-section .bb.b1 { width: 40px; height: 40px; top: 10px; left: 10px; }
.inner-page .philosophy-section .bb.b2 { width: 24px; height: 24px; top: 20px; left: 60px; }
.inner-page .philosophy-section .bb.b3 { width: 30px; height: 30px; top: 60px; left: 20px; }
.inner-page .philosophy-section .bb.b4 { width: 18px; height: 18px; top: 5px; left: 100px; }
.inner-page .philosophy-section .bb.b5 { width: 34px; height: 34px; top: 55px; left: 90px; }
.inner-page .philosophy-section .bb.b6 { width: 14px; height: 14px; top: 90px; left: 55px; }
.inner-page .philosophy-section .bb.b7 { width: 22px; height: 22px; top: 90px; left: 120px; }
.inner-page .philosophy-section .bb.b8 { width: 12px; height: 12px; top: 30px; left: 130px; }

/* ---------- Footer bar ---------- */
.inner-page .philosophy-section .footer-bar {
  position: relative;
  z-index: 2;
  background: #131c33;
  padding: 26px 24px 30px;
  text-align: center;
}

.inner-page .philosophy-section .pillars-list {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 18px;
  letter-spacing: 0.5px;
  color: #fff;
  margin-bottom: 16px;
}

.inner-page .philosophy-section .pillars-list .gold-text {
  color: #c9974a;
}

.inner-page .philosophy-section .footer-sub {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  color: #cfd3e2;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 1.5px;
}

.inner-page .philosophy-section .footer-line {
  width: 60px;
  height: 1px;
  background: #445;
}



/* ---------- Tech cards row ---------- */
.inner-page .nutra-tech-section .tech-row {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: stretch;
  gap: 0;
  margin-bottom: 40px;
}

.inner-page .nutra-tech-section .tech-card {
  flex: 1 1 0;
  min-width: 0;
  background: #fdfbf6;
  border: 1px solid #ece3cd;
  border-radius: 14px;
  padding: 28px 16px;
  text-align: center;
}

.inner-page .nutra-tech-section .tech-icon {
  width: 76px;
  height: 76px;
  border-radius: 50%;
  border: 1.5px solid #c9974a;
  color: #b8873a;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
}

.inner-page .nutra-tech-section .tech-icon svg {
  width: 30px;
  height: 30px;
}

.inner-page .nutra-tech-section .tech-card h3 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 0.3px;
  color: #16213e;
  margin-bottom: 12px;
  line-height: 1.35;
}

.inner-page .nutra-tech-section .tech-card h3 sup {
  font-size: 45%;
}

.inner-page .nutra-tech-section .tech-tag {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.4px;
  color: #c08a34;
  line-height: 1.5;
  margin-bottom: 14px;
}

.inner-page .nutra-tech-section .tech-divider {
  display: block;
  width: 30px;
  height: 1px;
  background: #d9c9a0;
  margin: 0 auto 14px;
}

.inner-page .nutra-tech-section .tech-desc {
  font-size: 12.5px;
  line-height: 1.6;
  color: #4a5170;
}

.inner-page .nutra-tech-section .connector {
  flex: 0 0 auto;
  width: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.inner-page .nutra-tech-section .c-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #c9974a;
}


/* ---------- Objective row ---------- */
.inner-page .nutra-tech-section .objective-row {
  position: relative;
  z-index: 2;
  text-align: center;
  margin-bottom: 34px;
}

.inner-page .nutra-tech-section .objective-label {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #16213e;
  margin-bottom: 18px;
}

.inner-page .nutra-tech-section .objective-line {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

.inner-page .nutra-tech-section .objective-text {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 18px;
  color: #16213e;
}

.inner-page .nutra-tech-section .v-line {
  width: 1px;
  height: 22px;
  background: #d9c9a0;
}

/* ---------- Banner card ---------- */
.inner-page .nutra-tech-section .banner-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 30px;
  background: #131c33;
  border-radius: 18px;
  padding: 40px 46px;
  overflow: hidden;
}

.inner-page .nutra-tech-section .banner-helix, .inner-page .nutra-tech-section .banner-molecule {
  position: absolute;
  pointer-events: none;
  opacity: 0.7;
}

.inner-page .nutra-tech-section .banner-helix {
  top: 10px;
  left: 10px;
  width: 220px;
  height: 140px;
}

.inner-page .nutra-tech-section .banner-helix .dot {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff, #c9974a 70%, #8a651f);
}

.inner-page .nutra-tech-section .banner-helix .dot:nth-child(1) { top: 10px; left: 10px; }
.inner-page .nutra-tech-section .banner-helix .dot:nth-child(2) { top: 30px; left: 60px; }
.inner-page .nutra-tech-section .banner-helix .dot:nth-child(3) { top: 50px; left: 20px; }
.inner-page .nutra-tech-section .banner-helix .dot:nth-child(4) { top: 70px; left: 80px; }
.inner-page .nutra-tech-section .banner-helix .dot:nth-child(5) { top: 90px; left: 30px; }
.inner-page .nutra-tech-section .banner-helix .dot:nth-child(6) { top: 20px; left: 120px; }
.inner-page .nutra-tech-section .banner-helix .dot:nth-child(7) { top: 60px; left: 140px; }
.inner-page .nutra-tech-section .banner-helix .dot:nth-child(8) { top: 100px; left: 100px; }

.inner-page .nutra-tech-section .banner-molecule {
  top: 10px;
  right: 10px;
  width: 260px;
  height: 160px;
}

.inner-page .nutra-tech-section .banner-molecule .node {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #cfe0ff, #4a6fb0 70%, #23385f);
}

.inner-page .nutra-tech-section .banner-molecule .node:nth-child(1) { top: 20px; right: 40px; width: 22px; height: 22px; }
.inner-page .nutra-tech-section .banner-molecule .node:nth-child(2) { top: 70px; right: 110px; width: 14px; height: 14px; }
.inner-page .nutra-tech-section .banner-molecule .node:nth-child(3) { top: 110px; right: 40px; width: 10px; height: 10px; }
.inner-page .nutra-tech-section .banner-molecule .node:nth-child(4) { top: 40px; right: 180px; width: 18px; height: 18px; }
.inner-page .nutra-tech-section .banner-molecule .node:nth-child(5) { top: 130px; right: 150px; width: 8px; height: 8px; }

.inner-page .nutra-tech-section .banner-molecule .link {
  position: absolute;
  height: 1px;
  background: rgba(150,180,230,0.6);
  transform-origin: left center;
}

.inner-page .nutra-tech-section .banner-molecule .l1 { top: 32px; right: 70px; width: 90px; transform: rotate(155deg); }
.inner-page .nutra-tech-section .banner-molecule .l2 { top: 90px; right: 70px; width: 100px; transform: rotate(210deg); }
.inner-page .nutra-tech-section .banner-molecule .l3 { top: 90px; right: 170px; width: 60px; transform: rotate(130deg); }

.inner-page .nutra-tech-section .banner-logo {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
}

.inner-page .nutra-tech-section .hexagon.large {
  width: 56px;
  height: 56px;
  font-size: 22px;
  border-color: #c9974a;
  color: #c9974a;
}

.inner-page .nutra-tech-section .banner-text {
  position: relative;
  z-index: 2;
  flex: 1 1 auto;
  text-align: center;
}

.inner-page .nutra-tech-section .banner-eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #c9974a;
  margin-bottom: 8px;
}

.inner-page .nutra-tech-section .banner-text h2 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: clamp(22px, 2.8vw, 34px);
  color: #fff;
  margin-bottom: 4px;
}

.inner-page .nutra-tech-section .hexagon.small-hex {
  width: 22px;
  height: 22px;
  font-size: 9px;
  border-color: rgba(255,255,255,0.5);
  color: rgba(255,255,255,0.8);
}

.inner-page .nutra-tech-section .banner-desc {
  font-size: 14.5px;
  line-height: 1.7;
  color: #c7cce0;
  max-width: 640px;
  margin: 0 auto;
}

.inner-page .nutra-tech-section .banner-text p.banner-eyebrow {
  color: #000;
  color: var(--accent-gold);
  font-family: var(--heading-font);
  font-weight: normal;
}
.inner-page .nutra-tech-section .banner-text p {
  font-size: 15px;
  line-height: 1.7;
  color: #fff;
  max-width: 640px;
  margin: 0 auto;
}


.inner-page .vision-supplementation-section {
  position: relative;
  margin: 0 auto;
  background: linear-gradient(135deg, #f4e9d6 0%, #faf3e6 40%, #fdfbf7 70%);
  overflow: hidden;
}

.inner-page .vision-supplementation-section .gold-text {
  color: #b8873a;
}

/* ---------- Background decor ---------- */
.inner-page .vision-supplementation-section .bg-molecule, .bg-helix {
  position: absolute;
  pointer-events: none;
  opacity: 0.5;
}

.inner-page .vision-supplementation-section .bg-molecule {
  top: 0;
  left: 0;
  width: 260px;
  height: 260px;
}

.inner-page .vision-supplementation-section .bg-molecule .node {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff, #d9c9a0 70%, #b9a06a);
}

.inner-page .vision-supplementation-section .bg-molecule .node:nth-child(1) { top: 20px; left: 30px; width: 28px; height: 28px; }
.inner-page .vision-supplementation-section .bg-molecule .node:nth-child(2) { top: 80px; left: 100px; width: 16px; height: 16px; }
.inner-page .vision-supplementation-section .bg-molecule .node:nth-child(3) { top: 130px; left: 40px; width: 12px; height: 12px; }
.inner-page .vision-supplementation-section .bg-molecule .node:nth-child(4) { top: 170px; left: 140px; width: 20px; height: 20px; }
.inner-page .vision-supplementation-section .bg-molecule .node:nth-child(5) { top: 210px; left: 80px; width: 10px; height: 10px; }
.inner-page .vision-supplementation-section .bg-molecule .node:nth-child(6) { top: 50px; left: 190px; width: 8px; height: 8px; }

.inner-page .vision-supplementation-section .bg-molecule .link {
  position: absolute;
  height: 1px;
  background: #cbb888;
  transform-origin: left center;
}

.inner-page .vision-supplementation-section .bg-molecule .l1 { top: 34px; left: 45px; width: 90px; transform: rotate(28deg); }
.inner-page .vision-supplementation-section .bg-molecule .l2 { top: 90px; left: 55px; width: 90px; transform: rotate(-25deg); }
.inner-page .vision-supplementation-section .bg-molecule .l3 { top: 145px; left: 55px; width: 100px; transform: rotate(15deg); }
.inner-page .vision-supplementation-section .bg-molecule .l4 { top: 65px; left: 105px; width: 100px; transform: rotate(-10deg); }

.inner-page .vision-supplementation-section .bg-helix {
  top: 0;
  right: 0;
  width: 220px;
  height: 340px;
}

.inner-page .vision-supplementation-section .bg-helix .dot {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #fff, #d9c9a0 70%, #b9a06a);
}

.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(1) { top: 10px; left: 40px; }
.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(2) { top: 45px; left: 100px; }
.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(3) { top: 80px; left: 40px; }
.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(4) { top: 115px; left: 110px; }
.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(5) { top: 150px; left: 50px; }
.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(6) { top: 185px; left: 120px; }
.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(7) { top: 220px; left: 60px; }
.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(8) { top: 255px; left: 130px; }
.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(9) { top: 290px; left: 70px; }
.inner-page .vision-supplementation-section .bg-helix .dot:nth-child(10) { top: 320px; left: 140px; }

/* ---------- Header ---------- */
.inner-page .vision-supplementation-section .header {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 1100px;
  margin: 0 auto;
  padding: 44px 24px 34px;
}

.inner-page .vision-supplementation-section .eyebrow {
  color: #c08a34;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 3px;
  margin-bottom: 16px;
}

.inner-page .vision-supplementation-section .eyebrow sup {
  font-size: 60%;
}

.inner-page .vision-supplementation-section .hex-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-bottom: 18px;
}

.inner-page .vision-supplementation-section .hex-row.small {
  margin: 20px 0 0;
}

.inner-page .vision-supplementation-section .hex-line {
  width: 70px;
  height: 1px;
  background: #c08a34;
}

.inner-page .vision-supplementation-section .hex-line.dark {
  background: rgba(255,255,255,0.35);
}

.inner-page .vision-supplementation-section .hexagon {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  clip-path: polygon(50% 0%, 93% 25%, 93% 75%, 50% 100%, 7% 75%, 7% 25%);
  border: 1.5px solid #c08a34;
  color: #c08a34;
  flex: 0 0 auto;
}

.inner-page .vision-supplementation-section .hexagon .sq {
  width: 8px;
  height: 8px;
  border: 1.4px solid #c08a34;
}

.inner-page .vision-supplementation-section .dot-icon {
  width: 22px;
  height: 22px;
  color: #c08a34;
  display: flex;
  align-items: center;
  justify-content: center;
}

.inner-page .vision-supplementation-section .dot-icon.light {
  color: #c9974a;
}

.inner-page .vision-supplementation-section .header h1 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: clamp(30px, 5vw, 62px);
  letter-spacing: 1px;
  color: #16213e;
  line-height: 1.2;
}

/* ---------- Columns row ---------- */
.inner-page .vision-supplementation-section .columns-row {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  gap: 40px;
  max-width: 1400px;
  margin: 0 auto;
  padding: 30px 24px 50px;
}

.inner-page .vision-supplementation-section .col {
  flex: 1 1 0;
  min-width: 0;
}

.inner-page .vision-supplementation-section .col-heading {
  font-size: 16px;
  font-weight: 700;
  color: #16213e;
  line-height: 1.5;
  margin-bottom: 14px;
}

.inner-page .vision-supplementation-section .col-body {
  font-size: 14.5px;
  line-height: 1.7;
  color: #4a5170;
  margin-bottom: 6px;
}

.inner-page .vision-supplementation-section .col-body em {
  font-style: italic;
}

.inner-page .vision-supplementation-section .col-divider {
  width: 1px;
  align-self: stretch;
  background: #ddc9a4;
  flex: 0 0 auto;
}

.inner-page .vision-supplementation-section .question-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 4px;
  position: relative;
}

.inner-page .vision-supplementation-section .question-list::before {
  content: "";
  width: 1px;
  height: 75%;
  background: #c08a34;
  position: absolute;
  left: 23.5px;
  top: 8px;
}

.inner-page .vision-supplementation-section .question-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 15px;
  color: #333c58;
  line-height: 1.5;
}

.inner-page .vision-supplementation-section .q-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 6px;
  flex: 0 0 auto;
}

.inner-page .vision-supplementation-section .q-dot.filled {
  background: #c08a34;
}

.inner-page .vision-supplementation-section .q-dot.hollow {
  border: 1.4px solid #c08a34;
  background: #faf4e7;
  position: relative;
}

.inner-page .vision-supplementation-section .mini-divider {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 18px 0;
}

.inner-page .vision-supplementation-section .mini-divider .line {
  flex: 1 1 auto;
  height: 1px;
  background: #ddc9a4;
}

.inner-page .vision-supplementation-section .mini-divider .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  border: 1.4px solid #c08a34;
  flex: 0 0 auto;
}

/* ---------- Commitment block ---------- */
.inner-page .vision-supplementation-section .commitment-block {
  position: relative;
  z-index: 2;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 24px 50px;
}

.inner-page .vision-supplementation-section .commitment-title-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-bottom: 36px;
}

.inner-page .vision-supplementation-section .commitment-title-row h2 {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 1px;
  color: #c08a34;
  white-space: nowrap;
}

.inner-page .vision-supplementation-section .c-line {
  flex: 1 1 auto;
  max-width: 260px;
  height: 1px;
  background: #ddc9a4;
}

.inner-page .vision-supplementation-section .commitment-row {
  display: flex;
  align-items: flex-start;
  gap: 20px;
}

.inner-page .vision-supplementation-section .commitment-item {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.inner-page .vision-supplementation-section .commitment-icon {
  flex: 0 0 auto;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  border: 1.5px solid #c9974a;
  color: #b8873a;
  display: flex;
  align-items: center;
  justify-content: center;
}

.inner-page .vision-supplementation-section .commitment-icon svg {
  width: 26px;
  height: 26px;
}

.inner-page .vision-supplementation-section .commitment-text h3 {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.3px;
  color: #16213e;
  margin-bottom: 8px;
  line-height: 1.35;
}

.inner-page .vision-supplementation-section .commitment-text p {
  font-size: 13px;
  line-height: 1.5;
  color: #4a5170;
}

/* ---------- Footer band ---------- */
.inner-page .vision-supplementation-section .footer-band {
  position: relative;
  background: #131c33;
  padding: 46px 24px 40px;
  overflow: hidden;
}

.inner-page .vision-supplementation-section .wave-decor {
  position: absolute;
  bottom: 0;
  width: 340px;
  height: 160px;
  opacity: 0.5;
  background-repeat: no-repeat;
}

.inner-page .vision-supplementation-section .wave-decor.left {
  left: 0;
  background: radial-gradient(circle at 20% 100%, rgba(200,150,60,0.35), transparent 60%);
}

.inner-page .vision-supplementation-section .wave-decor.right {
  right: 0;
  background: radial-gradient(circle at 80% 100%, rgba(200,150,60,0.35), transparent 60%);
}

.inner-page .vision-supplementation-section .footer-content {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 900px;
  margin: 0 auto;
}

.inner-page .vision-supplementation-section .footer-tags {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  flex-wrap: wrap;
  font-family: 'Playfair Display', serif;
  font-weight: 600;
  font-size: 17px;
  letter-spacing: 0.5px;
  color: #c9974a;
  margin-bottom: 4px;
}

.inner-page .vision-supplementation-section .f-divider {
  width: 1px;
  height: 20px;
  background: rgba(255,255,255,0.25);
}

.inner-page .vision-supplementation-section .footer-quote {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(17px, 2vw, 22px);
  color: #fff;
  margin: 22px 0 30px;
}

.inner-page .vision-supplementation-section .footer-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 10px;
}

.inner-page .vision-supplementation-section .hexagon.large {
  width: 46px;
  height: 46px;
  font-size: 18px;
  color: #c9974a;
  border-color: #c9974a;
  font-family: 'Playfair Display', serif;
  font-weight: 700;
}

.inner-page .vision-supplementation-section .logo-text {
  font-family: 'Playfair Display', serif;
  font-weight: 700;
  font-size: clamp(26px, 3vw, 36px);
  color: #fff;
}

.inner-page .vision-supplementation-section .logo-sub-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}

.inner-page .vision-supplementation-section .logo-sub {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 3px;
  color: #c9974a;
}

.inner-page .vision-supplementation-section .logo-sub sup {
  font-size: 60%;
}


.inner-page .lipid-section .icon-circle .liposomebg, .inner-page .lipid-section .feature-icon .liposomebg {
  border: 0;
  border-radius: 70px;
  margin: 0;
  background: transparent;
}
.icon-circle {
}
.inner-page .lipid-section .philosophy-left .icon-circle {
  border: 0;
}
.inner-page .why-section .path-circle.grey {
  border: 0;
  background: transparent;
}
.inner-page .why-section .path-circle.grey .image > img {
  border: 0;
  background: transparent;
  border-radius: 70px;
}
.inner-page .why-section .path-item .image img {
  border: 0;
  border-radius: 70px;
}
.inner-page .future-section .standard-item {
  border: 0;
}
.inner-page .future-section .standard-item .liposomebg {
  border: 0;
  background: transparent;
  border-radius: 60px;
}
.inner-page .future-section .path-item .image > img {
  border: 0;
  background: transparent;
  border-radius: 70px;
}
.inner-page .philosophy-section .pillar-card .liposomebg {
  border: 0;
  border-radius: 70px;
}
.inner-page .nutra-tech-section .tech-card .liposomebg {
  border-radius: 70px;
  border: 0;
}
.inner-page .vision-supplementation-section .commitment-item .liposomebg {
  border: 0;
  border-radius: 70px;
}

  
@media (max-width: 460px) {
    .xray-section .guarantees {
        grid-template-columns: 1fr;
    }

    .xray-section .title {
        font-size: 3.4rem;
        margin-top: 0;
        line-height: normal;
    }
}

.eco-section{ margin:0 auto; padding:64px 24px;    background: #fbfaff; }
.orbit-wrap .image {
    display: flex;
    justify-content: center;
}


  .eco-section .eco-grid{
    display:grid;
    grid-template-columns:390px .6fr 320px;
    align-items:center;
    gap:0;
  }
  .eco-section .eco-left, .eco-section .eco-right{ padding:0 32px; }
  .eco-section .eco-left{ border-right:1px solid var(--border); }
  .eco-section .eco-right{ border-left:1px solid var(--border); }

  .eco-section .eyebrow{
    display:flex; align-items:center; gap:10px;
    font-size:11.5px; font-weight:700; color:#b9720a;
    margin-bottom:18px;
  }
  .eco-section .eyebrow::before{ content:"\2192"; color:#b9720a; }
  .eco-section .eyebrow .line{ flex:1; height:1px; background:var(--border); }
  .eco-section .eyebrow .hex-icon{ width:14px;height:14px; stroke:#b9720a; flex-shrink:0; }

  .eco-section .eco-left h2{
    font-size:34px;
    font-weight:600;
    color:#001f3f;
    line-height:1.28;
    /* font-family: 'Playfair Display'; */
    margin-bottom:16px;
    font-family: var(--heading-font);
  }
  .eco-section .eco-left h2 .accent{ color:#b9720a; display:block; }
  .eco-section .mini-divider{
    display:flex; align-items:center; gap:8px; margin-bottom:18px;
  }
  .eco-section .mini-divider .line{ width:28px; height:1px; background:#b9720a; }
  .eco-section .mini-divider .dot{ width:5px;height:5px; border-radius:50%; border:1.3px solid #b9720a; }
  .eco-section .eco-left p{font-size:13.5px;color:#001f3f;line-height:1.7;margin-bottom:26px;font-family: var(--text-font);}
  .eco-section .btn-outline-nav{
    border:1.5px solid #b9720a;
    color:#001f3f;
    background:none;
    border-radius:6px;
    padding:13px 20px;
    font-size:11.5px; font-weight:800; 
    display:inline-flex; align-items:center; gap:8px;
    cursor:pointer;
    font-family:inherit;
  }
  .eco-section .btn-outline-nav svg{ width:12px;height:12px; stroke:#001f3f; }

  .eco-section .eco-right h2{ font-size:15px; font-weight:800; color:#b9720a;  margin-bottom:16px; }
  .eco-section .eco-right p{ font-size:12.5px; color:#001f3f; line-height:1.7; }



  /* ---------- Mobile-only vision card ---------- */
  .mobile-vision{ display:none; }

  /* ================= MOBILE ================= */
  @media (max-width:900px){
    .eco-section{ padding:44px 18px; }
    .eco-section .eco-grid{ display:block; }
    .eco-section .eco-left, .eco-section .eco-right{ border:none; padding:0; text-align:center; }
    .eco-section .eyebrow{ justify-content:center; margin-bottom:14px; }
    .eco-section .eyebrow::before{ display:none; }
    .eco-section .eyebrow .line{ flex:0 0 24px; }

    .eco-section .eco-left h1{ font-size:24px; margin-bottom:14px; }
    .eco-section .mini-divider{ display:none; }
    .eco-section .eco-left p{ font-size:13px; max-width:360px; margin:0 auto 22px; }
    .eco-section .btn-outline-nav{ width:100%; max-width:320px; justify-content:center; margin:0 auto 36px; }

.orbit-wrap .image > img {
    width: 100%;
}

    .eco-section .eco-right{ display:none; }
    .eco-section .mobile-vision{
      display:flex;
      align-items:flex-start;
      gap:16px;
      max-width:420px;
      margin:44px auto 0;
      border:1px solid #e5e5e5;
      border-radius:12px;
      padding:22px;
      text-align:left;
      background: #fff;
    }
    .eco-section .mobile-vision .icon-wrap{
      width:50px;height:50px; border-radius:50%; flex-shrink:0;
      background:#fdf6ea; border:1.5px solid #b9720a;
      display:flex; align-items:center; justify-content:center;
    }
    .eco-section .mobile-vision .icon-wrap svg{ width:20px;height:20px; stroke:#b9720a; }
    .eco-section .mobile-vision h2{ font-size:13.5px; font-weight:800; color:#001f3f; margin-bottom:8px; }
    .eco-section .mobile-vision p{ font-size:12px; color:#001f3f; line-height:1.65; }
  }

/* Responsive adjustments */
@media (max-width: 1024px) {
    .footer-top {
        grid-template-columns: 1fr;
        text-align: center;
        display: flex;
        flex-direction: column;
    }

    .footer-tagline {
        border-left: none;
        padding-left: 0;
        border-top: 1px solid var(--accent-gold);
        border-bottom: 1px solid var(--accent-gold);
        padding: 20px 0;
    }

    .footer-middle {
        grid-template-columns: repeat(3, 1fr);
    }

    .footer-connect-col {
        border-left: none;
        padding-left: 0;
        grid-column: span 3;
        margin-top: 20px;
    }

    .features-row {
        flex-wrap: wrap;
        gap: 20px;
        justify-content: center;
    }
}

@media (max-width: 768px) {
    .header-left {
        gap: 20px;
    }

    .main-nav {
        display: none;
        /* simple mobile hide for now */
    }

    .footer-middle {
        grid-template-columns: 1fr 1fr;
    }

    .footer-connect-col {
        grid-column: span 2;
    }

    .copyright-row {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
}

/* --- HERO SECTION --- */
.hero-section {
    background: linear-gradient(135deg, #fdfdff 0%, #edf2f7 100%);
    padding: 80px 40px;
    overflow: hidden;
    color: #112a46;
    background: #fbfbfb;
    padding: 0px 0px 0px 40px;
}

.hero-container {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

.hero-left {
    flex: 1;
    max-width: 650px;
    animation: fadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
    opacity: 0;
    transform: translateY(30px);
}

.hero-title {
    /* font-family: var(--heading-font); */
    font-size: 64px;
    line-height: 1.1;
    margin-bottom: 25px;
    font-weight: 700;
    font-family: var(--heading-font);
}

.hero-title .text-blue {
    color: #001f3f;
}

.hero-title .text-gold {
    color: #b9720a;
}

.hero-subtitle {
    font-size: 22px;
    color: #001f3f;
    margin-bottom: 40px;
    line-height: 1.6;
    font-weight: 400;
    font-family: var(--text-font);
}

.hero-features {
    display: flex;
    gap: 25px;
    margin-bottom: 50px;
}

.feature-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 15px;
}

.feature-card img {
    height: 75px;
    width: auto;
    mix-blend-mode: multiply;
    transition: transform 0.3s ease;
}

.feature-card:hover img {
    transform: translateY(-5px);
}

.feature-card span {
    font-size: 11px;
    font-weight: 800;
    color: #001f3f;
    text-transform: uppercase;
    font-family: var(--text-font);
}

.hero-actions {
    display: flex;
    gap: 20px;
}

.btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 15px 30px;
    font-size: 13px;
    font-weight: 600;
    
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
}

.btn-primary {
    background-color: #001f3f;
    color: #fff;
    border: 2px solid #001f3f;
}

.btn-primary:hover {
    background-color: #000;
    border-color: #000;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(0, 31, 63, 0.15);
}

.btn-secondary {
    background-color: transparent;
    color: #b9720a;
    border: 2px solid #b9720a;
}

.btn-secondary:hover {
    background-color: #b9720a;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(201, 138, 48, 0.15);
}

.hero-right {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    animation: fadeLeft 1.2s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
    opacity: 0;
    transform: translateX(40px);
}

.hero-image-wrapper {
    position: relative;
    width: 100%;
    max-width: 600px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.liposome-bg {
    /*position: absolute;*/
    /*width: 140%;
    max-width: 750px;*/
    /*left: -40%;*/
    top: 50%;
    transform: translateY(0%);
    z-index: 1;
    /*animation: pulseFloat 8s ease-in-out infinite alternate;*/
    mix-blend-mode: multiply;
}

.product-bottle {
    position: relative;
    z-index: 2;
    width: 55%;
    max-width: 320px;
    filter: drop-shadow(20px 20px 30px rgba(0, 0, 0, 0.15));
    animation: float 5s ease-in-out infinite;
    margin-right: 20px;
}

@media screen and (min-width:1600px) {
    
    body .improve-section h2, body .science-section h2  {
    font-size: 48px;
    }
    .hero-section {
        background: linear-gradient(135deg, #fdfdff 0%, #edf2f7 100%);
        padding: 0px 0px 0px 40px;
        overflow: hidden;
        color: #112a46;
        background: #fbfbfb;
    }

    .hero-container {
        max-width: none;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 40px;
    }

    .hero-left {
        flex: 1;
        max-width: 650px;
        animation: fadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
        opacity: 0;
        transform: translateY(30px);
        /*position: absolute;
        left: 13%;*/
    }

    .hero-right {
        justify-content: end;
    }
    
    .exists-column {
        min-height: 320px;
    }
    .exists-content-wrapper {
        grid-template-columns: .9fr 1.2fr;
        /*padding-right: calc(-40vw + 70%);*/
    }
    
    .exists-title {
        line-height: normal;
    }
    
    body .exists-content-wrapper {
        grid-template-columns: .8fr 1.4fr;
        /*padding-right: calc(-40vw + 70%);*/
    }
    
    .hero-section {
        padding: 0px 0px 0px 80px;
    }
    
    body .exists-section {
        padding-left: 80px;
    }
    
    body .exists-sphere-block {
        margin-right: calc(-49vw + 50%);
    }
    
    .newsletter-form form input[type="email"] {
  width: 50%;
 
}

.inner-page.about-page .divider-v {
    position: relative;
  left: -25px;
}
    
}

@media screen and (max-width:1550px) {
    .liposome-bg {
        width: 140%;
        max-width: 750px;
    }
    
    
.inner-page.about-page .hero-inner .content {
  position: relative;
  z-index: 9;
}
.inner-page.about-page .intro {
  font-size: 14px;
  margin-bottom: 10px;
  line-height: 1.3;
}
.inner-page.about-page .eyebrow {
  padding-bottom: 0px;
  margin-bottom: 5px;
}
.inner-page.about-page .hero-section .headline {
  font-size: 34px;
  margin-bottom: 10px;
}
.body-text {
}
.inner-page.about-page .body-text {
  margin-bottom: 10px;
  font-size: 15px;
  line-height: 1.4;
  padding-right: 100px;
}
body .inner-page.about-page .hero-inner {
  padding: 0px 0px 0 64px;
}
body .inner-page.about-page .liposome-bg {
    max-width: 140%;
  }
.callout {
}
.inner-page.about-page .callout {
  margin-bottom: 10px;
}
.inner-page.about-page .compare-box {
  margin-bottom: 10px;
}
.inner-page.about-page .features {
  margin-bottom: 13px;
}
    
.inner-page .journey-section .headline {
  font-size: 30px;
}
.inner-page .journey-section .step-title {
  font-size: 13px;
}
.inner-page .journey-section .step-text {
  font-size: 12px;
  line-height: 1.4;
}
.inner-page .journey-section .header-col {
  padding-bottom: 100px;
    width: 71%;
    padding-top: 100px;
}
.inner-page .journey-section .portrait-col {
  width: 28%;
}
}


/* Animations */
@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translateX(40px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes float {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-15px);
    }

    100% {
        transform: translateY(0px);
    }
}

@keyframes pulseFloat {
    0% {
        transform: translateY(-50%) scale(1);
    }

    100% {
        transform: translateY(-50%) scale(1.05);
    }
}

@media (max-width: 1300px) {
    
.inner-page.about-page section.hero-section {
  /*! background: #f9f7f7; */
}
.inner-page .philosophy-section .wrap {
  max-width: 1170px;
}
.inner-page .future-section .hero h2 {
  font-size: 28px;
}
.inner-page .why-section .why-text h2 {
  font-size: 30px;
}
.inner-page .what-ds-lc-hero {
  margin-bottom: 10px;
  min-height: auto;
}
.inner-page .what-ds-lc-section {
  padding-top: 20px;
  padding-bottom: 40px;
}
.inner-page .what-ds-lc-block-heading {
  font-size: 20px;
  letter-spacing: 0;
}
.hero-section .hero-title, .inner-page.about-page .headline {
  font-size: 30px;
}
.inner-page.about-page .cta {
  padding: 10px 20px;
  letter-spacing: 0;
}
.inner-page.about-page .brand .image > img {
  max-width: 170px;
}
.inner-page.about-page .compare-box {
  padding: 5px 10px;
}
.inner-page.about-page .compare-item.yes-text {
  line-height: 1;
  font-size: 14px;
}
.inner-page.about-page .compare-item {
  font-size: 13px;
}
.inner-page.about-page .divider-v span {
  left: -10px;
  top: 6px;
}
.inner-page.about-page .brand {
  margin: 0;
}
.inner-page.about-page .hero-section .headline {
  margin-bottom: 10px;
  font-size: 30px;
}
}

@media (min-width: 1100px) {
    .exists-columns-block .exists-column {
        flex-shrink: unset;
        min-height: 320px;
    }
    
    .exists-col-title {
        font-size: 12px;
        letter-spacing: 0;
    }
}

/* Responsive HERO */
@media (max-width: 1100px) {
    .hero-features {
        flex-wrap: wrap;
    }

    .liposome-bg {
        width: 120%;
        left: -20%;
    }
}

@media (max-width: 1024px) {
    .hero-section {
        padding: 0;
        padding: 0 0 60px 0;
    }

    .hero-container {
        flex-direction: column-reverse;
        text-align: center;
        gap: 20px;
    }

    .hero-left {
        max-width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .hero-features {
        justify-content: center;
    }

    .hero-right {
        margin-top: 0px;
        width: 100%;
    }

    .hero-image-wrapper {
        justify-content: center;
    }

    .liposome-bg {
        width: 100%;
        left: 0;
        max-width: 100%;
        opacity: 0.8;
    }

    .product-bottle {
        margin-right: 0;
    }
}

@media (max-width: 768px) {
    .hero-title {
        font-size: 40px;
    }

    .hero-actions {
        flex-direction: column;
        width: 100%;
        max-width: 350px;
    }

    .btn {
        justify-content: center;
    }
}

/* --- WHY LIPOCENTRIC EXISTS SECTION --- */
.exists-section {
    background: linear-gradient(180deg, #ffffff 0%, #f7f9fb 100%);
    position: relative;
    padding: 0px 40px;
    overflow: hidden;
    color: #112a46;
}

/* Background glow behind the sphere */
.exists-section::after {
    content: '';
    position: absolute;
    top: 25%;
    right: -5%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(201, 138, 48, 0.05) 0%, rgba(255, 255, 255, 0) 70%);
    z-index: 1;
    pointer-events: none;
}

.exists-container {
    max-width: none;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

/* Header */
.exists-header {
    margin-bottom: 60px;
    text-align: center;
    padding-top: 70px;
}

.exists-subtitle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.exists-subtitle .line {
    display: inline-block;
    height: 1px;
    width: 50px;
    background-color: var(--accent-gold);
    opacity: 0.5;
}

.exists-sub-icon {
    width: 22px;
    height: 22px;
}

.exists-subtitle .subtitle-text {
    font-family: var(--text-font);
    font-size: 13px;
    font-weight: 600;
    
    color: var(--accent-gold);
    text-transform: uppercase;
}

/* Content Wrapper */
.exists-content-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 0px;
    display: grid;
    grid-template-columns: 1fr, 1fr, 1fr;
    grid-template-columns: .9fr 1fr;
    /*padding-right: calc(-40vw + 70%);*/
}
 
.exists-info-block {
    flex: 0 0 28%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 50px;
}

.exists-title {
    /* font-family: var(--heading-font); */
    font-size: 48px;
    line-height: 1.2;
    font-weight: 600;
    color: #001f3f;
    margin-bottom: 0;
    font-family: var(--heading-font);
    letter-spacing: 0;
}

.exists-title .text-gold-gradient {
    background: linear-gradient(135deg, #b9720a 0%, #e2ab55 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.exists-desc-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 25px 0;
}

.exists-desc-divider .divider-line {
    height: 1px;
    width: 35px;
    background-color: var(--accent-gold);
    opacity: 0.4;
}

.exists-desc-divider .divider-hexagon {
    width: 8px;
    height: 8px;
    border: 1px solid var(--accent-gold);
    transform: rotate(45deg);
}

.exists-desc-text {
    /* font-family: var(--text-font); */
    font-size: 16px;
    line-height: 1.6;
    color: #02205f;
    font-weight: 400;
    font-family: var(--text-font);
}

.exists-desc-text .highlight-gold {
    color: #b9720a;
    font-weight: 600;
}

/* Middle Columns Block */
.exists-columns-block {
    flex: 1;
}

.exists-columns-block:not(.slick-initialized) {
    display: flex;
    justify-content: space-between;
}

.exists-columns-block:not(.slick-initialized)>.exists-column {
    flex: 1;
}

.exists-columns-block.slick-slider .slick-track {
    display: flex !important;
    align-items: stretch;
}

.exists-columns-block.slick-slider .slick-slide {
    display: flex !important;
    flex-direction: column;
    height: auto;
}

.exists-columns-block.slick-slider .slick-slide[data-slick-index="0"] .exists-column {
    border-left: none !important;
}

.exists-col-text-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.exists-column {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 20px 15px;
    border-left: 1px solid #E8D6B3;
    transition: transform var(--transition-speed) cubic-bezier(0.2, 0.8, 0.2, 1), opacity var(--transition-speed) ease;
}

.exists-column:hover {
    transform: translateY(-8px);
}

.exists-col-icon-wrapper {
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.exists-col-icon {
    height: 60px;
    width: auto;
    object-fit: contain;
    /*transition: transform var(--transition-speed) ease;*/
}

.exists-column:hover .exists-col-icon {
    /*transform: scale(1.1);*/
}

.exists-col-title {
    /* font-family: var(--text-font); */
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
    color: #001f3f;
    text-transform: uppercase;
    margin-bottom: 12px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--text-font);
}

.exists-col-line {
    width: 25px;
    height: 2px;
    background-color: var(--accent-gold);
    margin: 0 auto 15px;
}

.exists-col-subtitle {
    /* font-family: var(--text-font); */
    font-size: 13px;
    font-weight: 600;
    color: var(--accent-gold);
    line-height: 1.3;
    margin-bottom: 12px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--text-font);
}

.exists-col-body {
    /* font-family: var(--text-font); */
    font-size: 14px;
    line-height: 1.3;
    color: #02205f;
    font-weight: 400;
    font-family: var(--text-font);
}

/* Right Sphere Block */
.exists-sphere-block {
    flex: 0 0 20%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: relative;
    margin-right: calc(-50vw + 50%);
    position: absolute;
    right: 0;
    top: 0;
}

.exists-sphere-container {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.exists-sphere-img {
    width: 100%;
    height: auto;
    z-index: 2;
    mix-blend-mode: multiply;
    /*animation: floatSphere 6s ease-in-out infinite;*/
}

.exists-sphere-shadow {
    position: absolute;
    bottom: -20px;
    width: 160px;
    height: 20px;
    background: radial-gradient(ellipse at center, rgba(0, 13, 34, 0.12) 0%, rgba(0, 13, 34, 0) 70%);
    z-index: 1;
    filter: blur(4px);
    animation: shadowPulse 6s ease-in-out infinite;
    pointer-events: none;
}

/* Bottom Highlight Card */
.exists-bottom-card {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(247, 249, 251, 0.9) 100%);
    border: 1px solid rgba(201, 138, 48, 0.15);
    box-shadow: 0 15px 35px rgba(0, 13, 34, 0.04);
    border-radius: 12px;
    padding: 22px 50px;
    margin-top: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    backdrop-filter: blur(5px);
    transition: transform var(--transition-speed) ease, box-shadow var(--transition-speed) ease;
    max-width: 1000px;
    margin: 90px auto 0;
    position: relative;
    top: -50px
}

.exists-bottom-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 40px rgba(0, 13, 34, 0.08);
}

.exists-bottom-card .card-left {
    display: flex;
    align-items: center;
    gap: 15px;
}

.exists-bottom-card .card-icon {
    height: 48px;
    width: auto;
    object-fit: contain;
}

.exists-bottom-card .card-text-blue {
    font-family: var(--heading-font);
    font-size: 24px;
    font-weight: 400;
    color: #001f3f;
    
}

.exists-bottom-card .card-text-blue .text-gold {
    color: #b9720a;
}

.exists-bottom-card .card-text-blue .font-bold {
    /*font-weight: 700;*/
}

.exists-bottom-card .card-divider {
    width: 1px;
    height: 35px;
    background-color: rgba(0, 31, 63, 0.12);
}

.exists-bottom-card .card-right {
    display: flex;
    align-items: center;
}

/* Carousel dots (hidden on desktop) */
.exists-carousel-dots {
    display: none;
}

/* ============================================================
   PROCESS SECTION
   Append to style.css. Uses existing tokens:
   --accent-gold, Playfair Display, Jost.
   ============================================================ */

.process-section {
    background-color: #ffffff;
    color: #02205f;
    padding: 100px 40px 0;
    background: #fafafb;
}

.process-container {
    max-width: 1400px;
    margin: 0 auto;
    text-align: center;
}

/* -- Heading -- */
.process-title {
    /* font-family: var(--heading-font); */
    font-weight: 600;
    font-size: 48px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    margin: 0 auto;
    max-width: 900px;
    font-family: var(--heading-font);
}

.process-title .text-blue {
    color: #02205f;
}

.process-title .text-gold {
    color: var(--accent-gold);
}

/* -- Divider with hex -- */
.process-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 22px auto 18px;
    color: var(--accent-gold);
}

.process-divider .line {
    display: block;
    width: 60px;
    height: 1px;
    background-color: var(--accent-gold);
    opacity: 0.7;
}

.process-divider .hex {
    display: inline-flex;
}

.process-subtitle {
    font-size: 16px;
    color: #02205e;
    max-width: 620px;
    margin: 0 auto 70px;
    line-height: 1.6;
    font-weight: normal;
    font-family: var(--text-font);
}

/* -- Steps row -- */
.process-steps {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 10px;
    margin-bottom: 90px;
}

.process-step {
    flex: 1 1 0;
    max-width: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.step-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.step-image img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.step-body {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.step-number {
    font-size: 14px;
    color: var(--accent-gold);
    
    margin-bottom: 10px;
}

.step-title {
    font-family: var(--text-font);
    font-size: 15px;
    font-weight: 600;
    
    color: #02205f;
    margin: 0 0 8px;
}

.step-underline {
    display: block;
    width: 34px;
    height: 2px;
    background-color: var(--accent-gold);
    margin-bottom: 14px;
}

.step-desc {
    font-size: 16px;
    color: #02205f;
    line-height: 1.4;
    margin: 0;
    letter-spacing: 0;
    font-weight: normal;
}

.process-arrow {
    color: #02205f;
    padding-top: 90px;
    /* vertically align with middle of images */
    flex: 0 0 auto;
}

/* -- Comparison bar -- */
.process-compare {
    display: grid;
    grid-template-columns: 1fr .5fr 1fr;
    align-items: center;
    gap: 30px;
    background-color: #fafafb;
    padding: 34px 40px;
    border-top: 1px solid #E8D6B3;
    border-bottom: 0px solid #E8D6B3;
    display: flex;
        justify-content: space-between;
}

.compare-item {
    display: flex;
    align-items: center;
    gap: 22px;
    text-align: left;
}

.process-compare .compare-item:last-of-type {
    justify-content: flex-start;
}

.compare-icon {
    width: 62px;
    height: 62px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 62px;
}

.compare-icon-plain {
    border: 1px solid #02205f;
    color: #02205f;
}

.compare-icon-gold {
    border: 1px solid var(--accent-gold);
    color: var(--accent-gold);
}

.compare-body p {
    margin: 2px 0;
    font-size: 14px;
    color: #02205f;
    line-height: 1.55;
    letter-spacing: 0;
    font-weight: normal;
}

.compare-emphasis {
    color: #02205f !important;
    font-weight: 600;
}

.compare-title {
    font-family: var(--text-font);
    font-size: 16px;
    font-weight: 600;
    
    margin: 0 0 6px;
    position: relative;
    padding-bottom: 8px;
}

.compare-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 34px;
    height: 2px;
    background-color: var(--accent-gold);
}

.compare-title-muted {
    color: #02205f;
}

.compare-title-gold {
    color: var(--accent-gold);
}

.compare-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #02205f;
    opacity: 1;
    border-left: 1px solid #E8D6B3;
    border-right: 1px solid #E8D6B3;
    justify-content: center
    width: 30%;
}

.compare-divider .line {
    display: block;
    width: 30px;
    height: 1px;
    background-color: #02205f;
}


/*=========== follow section css =============*/


.follow-section {
    background-color: #ffffff;
    color: #02205f;
    padding: 100px 40px 0;
    background: #fafafb;
}

.follow-container {
    max-width: 1400px;
    margin: 0 auto;
    text-align: center;
}

/* -- Heading -- */
.follow-title {
    font-family: var(--heading-font);
    font-weight: 500;
    font-size: 48px;
    line-height: 1.2;
    letter-spacing: -0.5px;
    margin: 0 auto;
    max-width: 900px;
}

.follow-title .text-blue {
    color: #02205f;
}

.follow-title .text-gold {
    color: var(--accent-gold);
    font-style: italic;
    font-weight: 500;
}

/* -- Divider with hex -- */
.follow-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 22px auto 18px;
    color: var(--accent-gold);
}

.follow-divider .line {
    display: block;
    width: 60px;
    height: 1px;
    background-color: var(--accent-gold);
    opacity: 0.7;
}

.follow-divider .hex {
    display: inline-flex;
}

.follow-subtitle {
    font-size: 16px;
    color: #02205e;
    max-width: 620px;
    margin: 0 auto 70px;
    line-height: 1.6;
}

/* -- Steps row -- */
.follow-steps {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 10px;
    margin-bottom: 90px;
}

.follow-step {
    flex: 1 1 0;
    max-width: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.step-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
}

.step-image img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.step-body {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.step-number {
    font-size: 14px;
    color: var(--accent-gold);
    
    margin-bottom: 10px;
}

.step-title {
    font-family: var(--text-font);
    font-size: 15px;
    font-weight: 600;
    
    color: #02205f;
    margin: 0 0 8px;
}

.step-underline {
    display: block;
    width: 34px;
    height: 2px;
    background-color: var(--accent-gold);
    margin-bottom: 14px;
}

.step-desc {
    font-size: 16px;
    color: #02205f;
    line-height: 1.4;
    margin: 0;
    font-family: var(--text-font);
}

.follow-arrow {
    color: #02205f;
    padding-top: 90px;
    /* vertically align with middle of images */
    flex: 0 0 auto;
}

/* -- Comparison bar -- */
.follow-compare {
    display: grid;
    grid-template-columns: 1fr .5fr 1fr;
    align-items: center;
    gap: 30px;
    background-color: #fafafb;
    padding: 34px 40px;
    border-top: 1px solid #e2e2e2;
    border-bottom: 0px solid #02205f;
}

.compare-item {
    display: flex;
    align-items: center;
    gap: 22px;
    text-align: left;
    font-family: var(--text-font);
}

.follow-compare .compare-item:last-of-type {
    justify-content: flex-start;
}

.compare-icon {
    width: 62px;
    height: 62px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 62px;
}

.compare-icon-plain {
    border: 1px solid #02205f;
    color: #02205f;
}

.compare-icon-gold {
    border: 1px solid var(--accent-gold);
    color: var(--accent-gold);
}

.compare-body p {
    margin: 2px 0;
    font-size: 14px;
    color: #02205f;
    line-height: 1.55;
}

.compare-emphasis {
    color: #02205f !important;
    font-weight: 600;
}

.compare-title {
    /* font-family: var(--text-font); */
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 6px;
    position: relative;
    padding-bottom: 8px;
    font-family: var(--text-font);
}

.compare-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 34px;
    height: 2px;
    background-color: var(--accent-gold);
}

.compare-title-muted {
    color: #02205f;
}

.compare-title-gold {
    color: var(--accent-gold);
}

.compare-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #02205f;
    opacity: 1;
    border-left: 1px solid #E8D6B3;
    border-right: 1px solid #E8D6B3;
    justify-content: center;
    width: 25%;
}

.compare-divider .line {
    display: block;
    width: 30px;
    height: 1px;
    background-color: #02205f;
}

/*=========== follow section css===========*/


.improve-section.section {

    margin: 0 auto;
    padding: 56px 24px 40px;
    background: #f4f6fb;
}

/* ---------- Header ---------- */
.improve-section .eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    font-size: 12px;
    font-weight: 700;
    
    color: #001f3f;
    margin-bottom: 14px;
}

.improve-section .eyebrow::before,
.improve-section .eyebrow::after {
    content: "";
    width: 34px;
    height: 1px;
    background: var(--accent-gold);
}

.improve-section .eyebrow .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    border: 1.5px solid var(--accent-gold);
    display: inline-block;
}

.improve-section h2 {
    text-align: center;
    font-size: 38px;
    font-weight: 800;
    color: #001f3f;
    line-height: 1.2;
    /* font-family: var(--heading-font); */
    font-family: var(--heading-font);
}

.improve-section h2 span {
    color: #b9720a;
}

.improve-section .subhead {
    text-align: center;
    color: #1c3a66;
    font-size: 15px;
    margin-top: 10px;
    margin-bottom: 36px;
    font-weight: normal;
}

/* ---------- Category tabs ---------- */
.improve-section .categories {
    display: grid;
    grid-template-columns: repeat(9, 1fr);
    gap: 14px;
    margin-bottom: 28px;
}

.improve-section .cat-btn {
    background: #fff;
    border: 1px solid #e3e7ef;
    border-radius: 10px;
    padding: 20px 8px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: all .18s ease;
    font-family: inherit;
}

.improve-section .cat-btn img {
    max-width: 40px;
}

.improve-section .cat-btn.active img {
    max-width: 40px;
}

.improve-section .cat-btn:hover {
    border-color: var(--navy-light);
}

.improve-section .cat-btn svg {
    width: 26px;
    height: 26px;
    stroke: #001f3f;
    transition: stroke .18s ease;
}

.improve-section .cat-btn span {
    font-size: 11px;
    font-weight: 700;
    
    color: #001f3f;
    text-align: center;
}

.improve-section .cat-btn.active {
    background: #001f3f;
    border-color: #001f3f;
    position: relative;
}

.improve-section .cat-btn.active svg {
    stroke: #fff;
}

.improve-section .cat-btn.active span {
    color: #fff;
}

.improve-section .cat-btn.active::after {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 36px;
    height: 2px;
    background: #b9720a;
}

/* ---------- Category panel (acts as the content card) ---------- */
.improve-section .cat-panel {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 0px;
    display: grid;
    grid-template-columns: 260px 1fr;
    column-gap: 32px;
    row-gap: 20px;
    align-items: center;
    margin-bottom: 20px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(247, 249, 251, 0.9) 100%);
    border: 1px solid rgba(240, 231, 220, 0.45);
    box-shadow: 0 15px 35px rgba(0, 13, 34, 0.04);
    border-radius: 15px;
    padding: 22px 20px;
}

.improve-section .cat-panel[hidden] {
    display: none;
}

.improve-section .cat-btn.active svg path {
    stroke: #fff;

}

.improve-section .cat-btn.active svg {
    fill: #fff;
    stroke: none;
}

.improve-section .cat-btn.active svg line.st0 {
    stroke: #fff;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.improve-section .cat-panel.fade-in {
    animation: fadeIn .25s ease;
}

.improve-section .content-left {
    grid-column: 1;
    grid-row: 1;
}

.improve-section .content-left h2 {
    font-size: 26px;
    font-weight: 800;
    color: #001f3f;
    line-height: 1.25;
    /* font-family: jost; */
    text-align: left;
    font-family: var(--heading-font);
}

.improve-section .content-left h2 .accent {
    color: #b9720a;
    display: block;
}

.improve-section .content-left p {
    color: #1c3a66;
    font-size: 14px;
    line-height: 1.6;
    margin: 6px 0 10px;
    font-weight: normal;
    line-height: normal;
    margin: 16px 0 22px;
    font-family: var(--text-font);
}

.improve-section .btn-primary {
    background: #001f3f;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 10px 10px;
    font-size: 12px;
    font-weight: 700;
    
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-family: inherit;
    font-weight: normal;
}

.improve-section .btn-primary:hover {}

/* product rail (carousel, shared markup for desktop + mobile) */
.improve-section .products-row {
    grid-column: 2;
    grid-row: 1;
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
}

.improve-section .rail-arrow {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 50%;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    flex-shrink: 0;
    transition: opacity .15s ease, border-color .15s ease;
}

.improve-section .rail-arrow:hover {
    border-color: var(--navy-light);
}

.improve-section .rail-arrow[disabled] {
    opacity: .35;
    cursor: default;
}

.improve-section .rail-arrow svg {
    width: 16px;
    height: 16px;
    stroke: #001f3f;
}

.improve-section .products-viewport {
    flex: 1;
    overflow: hidden;
}

.improve-section .products-track {
    display: flex;
    gap: 18px;
    transition: transform .35s ease;
}

.improve-section .product-card {
    text-align: center;
    flex: 0 0 calc(25% - 13.5px);
}

.improve-section .product-thumb {
    background: linear-gradient(135deg, #eef2fb, #e5ecfb);
    border-radius: 10px;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-bottom: 14px;
    overflow: hidden;
}

.improve-section .product-thumb>img {
    max-width: 100%;
}

.improve-section .product-thumb .bottle {
    width: 56px;
    height: 104px;
    background: #fff;
    border: 1px solid #dfe4ee;
    border-radius: 4px 4px 8px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 6px;
    font-weight: 800;
    color: #001f3f;
    text-align: center;
    padding: 6px 3px;
    line-height: 1.3;
}

.improve-section .product-thumb .badge {
    position: absolute;
    bottom: 8px;
    right: 8px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .08);
}

.improve-section .product-thumb .badge svg {
    width: 11px;
    height: 11px;
}

.improve-section .product-card h3 {
    font-size: 13.5px;
    font-weight: 600;
    color: #333;
    margin-bottom: 2px;
    font-family: var(--text-font);
}

.improve-section .product-card p {
    font-size: 13px;
    color: #333;
    line-height: 1.2;
    margin-bottom: 0px;
    min-height: 32px;
    font-family: var(--text-font);
    font-weight: normal;
}

.improve-section .learn-more {
    font-size: 11px;
    font-weight: 700;
    
    color: #001f3f;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.improve-section .learn-more svg {
    width: 11px;
    height: 11px;
}

.improve-section .dots {
    display: none;
    grid-column: 2;
    grid-row: 2;
    justify-content: center;
    gap: 6px;
}

.improve-section .dots span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #e3e3e3;
    transition: all .2s ease;
}

.improve-section .dots span.active {
    background: #001f3f;
    width: 16px;
    border-radius: 3px;
}

/* ---------- Feature strip ---------- */
.improve-section .features {
    background: var(--card-bg);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 26px 10px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(247, 249, 251, 0.9) 100%);
    border: 1px solid rgba(240, 231, 220, 0.45);
    box-shadow: 0 15px 35px rgba(0, 13, 34, 0.04);
    border-radius: 15px;
    padding: 22px 20px;
}

.improve-section .feature {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    padding: 0 18px;
    border-right: 1px solid var(--border);
    font-family: var(--text-font);
}

.improve-section .feature:last-child {
    border-right: none;
}

.improve-section .feature .icon-ring {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1.5px solid #001f3f;
    display: flex;
    align-items: center;
    justify-content: center;
}

.improve-section .feature .icon-ring svg {
    width: 20px;
    height: 20px;
    stroke: #001f3f;
}

.improve-section .feature h4 {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    color: #001f3f;
    font-family: var(--text-font);
}

.improve-section .feature p {
    font-size: 12px;
    color: #1c3a66;
    line-height: 1.5;
    font-family: var(--text-font);
    font-weight: normal;
    color: rgb(0, 31, 63);
    letter-spacing: 0;
}

.improve-section .feature-arrow {
    display: none;
}


.benefits-bar {
    max-width: 1240px;
    margin: 0 auto;
    background: #fff;
    border-radius: 15px;
    padding: 22px 20px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    box-shadow: 0 6px 30px rgba(11, 37, 69, .06);
}

.benefit {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 8px 10px;
}

.benefit+.benefit {
    border-left: 1px solid #e6e2d6;
    padding-left: 24px;
}

.benefit-icon {
    flex: 0 0 auto;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1.5px solid var(--ring);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #001f3f;
}

.benefit-icon svg {
    width: 28px;
    height: 28px;
    stroke: #001f3f;
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round
}

.benefit-title {
    font-weight: 700;
    font-size: 14px;
    
    text-transform: uppercase;
    color: #001f3f;
    margin: 0 0 6px;
}

.benefit-text {
    font-size: 14px;
    line-height: 1.5;
    color: #1c3a66;
    margin: 0;
    font-weight: normal;
    letter-spacing: 0;
}

.benefit-info {
    text-align: left;
}

.benefit-info h3.benefit-title {
    font-size: 12px;
    font-size: 13px;
    font-family: var(--text-font);
    font-weight: 600;
    letter-spacing: 0;
}

.benefit-icon img {
    max-width: 70px;
}

.benefit+.benefit {
    gap: 10px;
    font-family: var(--text-font);
}

.benefits-bar.exists-bottom-card {
    gap: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(247, 249, 251, 0.9) 100%);
    border: 1px solid rgba(201, 138, 48, 0.15);
    box-shadow: 0 15px 35px rgba(0, 13, 34, 0.04);
}

@media (max-width:960px) {
    
    .benefits-bar {
        grid-template-columns: 1fr 1fr;
        border-radius: 36px;
        padding: 24px;
        gap: 20px 24px;
    }

    .benefit+.benefit {
        border-left: none;
        padding-left: 10px
    }

    .benefit:nth-child(even) {
        border-left: 1px solid #e6e2d6;
        padding-left: 24px
    }

    .benefit:nth-child(n+3) {
        border-top: 1px solid #e6e2d6;
        padding-top: 20px
    }
}

@media (max-width:520px) {

    .benefits-bar {
        grid-template-columns: 1fr;
        border-radius: 28px;
        padding: 20px;
    }

    .benefit+.benefit {
        border-left: none;
        padding-left: 10px;
        border-top: 1px solid #e6e2d6;
        padding-top: 20px
    }

    .benefit:nth-child(even) {
        border-left: none;
        padding-left: 10px
    }
}


/* ============================================================
   RESPONSIVE — Tablet
   ============================================================ */
@media (max-width: 992px) {
    .process-section {
        padding: 80px 24px 0;
    }

    .process-title {
        font-size: 36px;
    }

    .process-steps {
        gap: 6px;
    }

    .process-arrow {
        padding-top: 70px;
    }

    .process-arrow svg {
        width: 28px;
    }

    .process-compare {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 28px;
    }

    .compare-divider {
        display: none;
    }
}

/* ============================================================
   RESPONSIVE — Mobile (vertical stack)
   ============================================================ */
@media (max-width: 640px) {
    
    .process-section {
        padding: 60px 20px 0;
    }

    .process-title {
        font-size: 26px;
        line-height: 1.25;
    }

    .process-subtitle {
        margin-bottom: 40px;
    }

    /* Steps: vertical, image left + text right, down arrows */
    .process-steps {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        margin-bottom: 50px;
    }

    .process-step {
        flex-direction: row;
        align-items: center;
        max-width: 100%;
        text-align: left;
        gap: 22px;
    }

    .step-image {
        width: 120px;
        height: 120px;
        aspect-ratio: 1 / 1;
        margin-bottom: 0;
        flex-shrink: 0;
        border-radius: 12px;
        background: #ffffff;
        box-shadow: 0 4px 14px rgba(10, 28, 58, 0.08);
        padding: 12px;
    }

    .step-body {
        align-items: flex-start;
        text-align: left;
    }

    .step-number {
        font-size: 20px;
        margin-bottom: 4px;
    }

    .step-title {
        font-size: 16px;
        
    }

    .step-underline {
        margin-bottom: 10px;
    }

    .step-desc {
        font-size: 13px;
    }

    /* Rotate arrow to point down between rows */
    .process-arrow {
        padding-top: 0;
        margin: 6px 0 6px 60px;
        /* aligns roughly under image column */
        transform: rotate(90deg);
        width: 24px;
        color: #02205f;
        opacity: 0.7;
    }

    .process-arrow svg {
        width: 24px;
        height: 10px;
    }

    /* Comparison: two side-by-side cards */
    .process-compare {
        grid-template-columns: 1fr 1fr;
        gap: 14px;
        padding: 22px 16px;
        background-color: #ffffff;
        border-top: 1px solid #e5e0d5;
        border-bottom: none;
    }

    .compare-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        background-color: #f7f5f0;
        border-radius: 8px;
        padding: 20px 16px;
    }

    .compare-icon {
        display: none;
    }

    .compare-title {
        font-size: 13px;
        
    }

    .compare-body p {
        font-size: 12.5px;
        line-height: normal;
    }

    .compare-divider {
        display: none;
    }
}


/* Animations for Sphere */
@keyframes floatSphere {
    0% {
        transform: translateY(0px) rotate(0deg);
    }

    50% {
        transform: translateY(-10px) rotate(1deg);
    }

    100% {
        transform: translateY(0px) rotate(0deg);
    }
}

@keyframes shadowPulse {
    0% {
        transform: scale(1);
        opacity: 0.8;
    }

    50% {
        transform: scale(0.85);
        opacity: 0.4;
    }

    100% {
        transform: scale(1);
        opacity: 0.8;
    }
}

section.hero-section {
    background: linear-gradient(135deg, #fdfdff 0%, #f7f8fb 100%);
}
.xray-section .title, .improve-section h2,body .science-section h2 {
    font-weight: 600;
}

.hero-section .hero-left {
        position: relative;
        z-index: 9;
    }
@media (max-width: 1600px) {
    .hero-container {
        max-width: none;
    }
    .hero-right .liposome-bg {
        width: 140%;
        max-width: 140%;
    }
        .hero-right {
        flex: none;
        height: 100%;
    }
.exists-columns-block .exists-column {
    /* background: #fff; */
}

.exists-columns-block-out {
    background: #ffffff0a;
    position: relative;
    z-index: 9;
    border-radius: 10px;
    backdrop-filter: blur(10px);
}
.exists-info-block {
    padding-right: 15px;
}
.exists-content-wrapper {
    grid-template-columns: .6fr 1fr;
    /*padding-right: calc(-40vw + 70%);*/
}
    .exists-content-wrapper {
        gap: 0px;
    }

    .exists-info-block {
        flex: 0 0 26%;
    }

    .exists-title {
        font-size: 38px;
        line-height: normal;
    }
    p.exists-desc-text {
        line-height: 1.3;
        font-size: 14px;
    }

    .exists-sphere-img {
        width: 100%;
    }

    .exists-bottom-card .card-text-blue {
        font-size: 24px;
    }
    
    .eco-section .eco-grid {
    grid-template-columns: 390px .5fr 320px;
    justify-content: space-between;
}
}


/* Responsive adjustments for Exists section */
@media (max-width: 1400px) {
    .process-section .process-title, .follow-section .process-title, .xray-section .title, .improve-section h2,.science-section h2, .eco-section .eco-left h2,
    section#shopify-section-template--17112933236943__featured_collection_PtGeMR .collection__title h2.title{
    font-size: 36px;
    font-weight: 600;
}


    .hero-right {
    flex: none;
    height: 100%;
}

.hero-section .hero-title, .inner-page.about-page .headline {
    font-size: 44px;
}

.hero-right .liposome-bg, 
.inner-page.about-page .liposome-bg{
    width: auto;
    max-width: 130%;
    object-fit: cover;
    height: 100%;
  }

.hero-section .hero-left {
    position: relative;
    z-index: 9;
}

section.hero-section {
    background: linear-gradient(135deg, #fdfdff 0%, #f7f8fb 100%);
}

.orbit-wrap .image > img {
    max-width: 510px;
}

.eco-section .eco-left h2 {
    font-size: 32px;
}


}




.eco-section .eco-right p {
    font-weight: normal;
    font-family: var(--text-font);
}

.eco-section .eco-left p {
    font-weight: normal;
}

.eco-section .eyebrow {
    font-weight: 600;
}

.eco-section .eco-right h2 {
    font-weight: 600;
}

@media (max-width: 1200px) {
    .exists-section {
        padding: 80px 30px;
    }

    .exists-content-wrapper {
        flex-direction: column;
        align-items: center;
        gap: 50px;
    }

    .exists-info-block {
        flex: 1;
        max-width: 650px;
        text-align: center;
        align-items: center;
    }

    .exists-desc-divider {
        justify-content: center;
    }

    .exists-columns-block {
        width: 100%;
        max-width: 450px;
        grid-template-columns: repeat(5, 1fr);
        margin: auto;
    }

    .exists-sphere-block {
        width: 100%;
        max-width: 400px;
        order: -1;
        /* puts sphere between header and content or at top */
        margin-bottom: 20px;
        margin-right: 0;
    }

    .exists-sphere-img {
        width: 100%;
    }
    
    
}

@media (max-width: 1300px) {
    .exists-title {
    font-size: 36px;
}
}

@media (max-width: 992px) {
    .exists-columns-block {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px 0;
    }

    /* Remove vertical borders for wrapped grid cells */
    .exists-column {
        border-left: none;
        border-bottom: 1px solid rgba(0, 31, 63, 0.05);
        padding: 20px;
    }

    /* We can create a neat grid structure on tablet */
    .exists-columns-block {
        border: 1px solid rgba(0, 31, 63, 0.05);
        border-radius: 8px;
        background-color: rgba(255, 255, 255, 0.4);
    }

    /* border styling for neat grid */
    .exists-column {
        border-left: 1px solid rgba(0, 31, 63, 0.05);
        border-bottom: 1px solid rgba(0, 31, 63, 0.05);
    }

    .exists-column:nth-child(3n+1) {
        border-left: none;
    }

    .exists-column:nth-child(4),
    .exists-column:nth-child(5) {
        border-bottom: none;
    }

    .exists-bottom-card {
        flex-direction: column;
        gap: 15px;
        padding: 25px;
        text-align: center;
    }

    .exists-bottom-card .card-divider {
        width: 60px;
        height: 1px;
    }

    .exists-bottom-card .card-left {
        flex-direction: column;
    }
}

.exists-header.desktop {
    display: block;
}

.exists-header.mobile {
    display: none;
}

.science-section{
    background:
      radial-gradient(circle at 8% 20%, rgba(255,255,255,.5), transparent 40%),
      radial-gradient(circle at 92% 75%, rgba(255,255,255,.4), transparent 35%),
      linear-gradient(180deg,#eaf0fb,#f4f7fd);
    padding:60px 24px 0;
  }
  .science-inner{  margin:0 auto; }

  /* ---------- Header ---------- */
  .science-section .eyebrow{
    display:flex;align-items:center;justify-content:center;gap:12px;
    font-size:12px;font-weight:700;color:#001f3f;
    margin-bottom:18px;
  }
  .science-section .eyebrow::before,.science-section .eyebrow::after{ content:"\2192"; color:#b9720a; font-size:13px; }
  .science-section .eyebrow::after {
    transform: rotateY(180deg);
}
  .science-section .eyebrow .snowflake{ width:16px;height:16px; stroke:#b9720a; }
  .science-section h2{text-align:center;font-size:38px;font-weight:800;color:#001f3f;line-height:1.25;/* font-family: 'Playfair Display'; */font-family: var(--heading-font);}
  .science-section h2 .accent{ color:#b9720a; display:block; }
  .science-section .divider{
    display:flex; align-items:center; justify-content:center; gap:10px;
    margin:14px 0 18px;
  }
  .science-section .divider::before,.divider::after{ content:""; width:60px;height:1px; background:#b9720a; }
  .science-section .divider .hex{ width:8px;height:8px; border:1.5px solid #b9720a; transform:rotate(45deg); }
  .science-section .subhead{
    text-align:center;
    color:#001f3f;
    font-size:15px;
    line-height:1.6;
    max-width:640px;
    margin:0 auto 40px;
    font-weight: normal;
    font-family: var(--text-font);
  }

  /* ---------- Topic cards ---------- */
  .science-section .topic-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    margin-bottom:20px;
  }
  .topic-grid .topic-inf {
  min-height: 140px;
}
  .science-section .topic-card{
    background:#fff;
    border:1px solid #eee;
    border-radius:12px;
    padding:0px;
    display:flex;
    flex-direction:column;
  }
  .science-section .topic-card .image > img {
    width: 100%;
}

.science-section .topic-card a.topic-link {
    padding: 10px 10px 15px 10px;
    justify-content: center;
    font-family: var(--text-font);
    font-size: 13px;
    font-weight: 500;
}
.science-section .topic-card .topic-icon {
    height: auto;
    width: auto;
}

.science-section .topic-card .topic-head {
    padding: 15px;
}

.science-section .topic-card .topic-icon > img {
    width: auto;
    max-width: 50px;
}
  .science-section .topic-head{
    display:flex;
    align-items:flex-start;
    gap:12px;
    margin-bottom:12px;
    font-family: var(--text-font);
  }
  .science-section .topic-icon{
    width:44px;height:44px; border-radius:50%; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
  }
  .science-section .topic-icon.navy{ background:#001f3f; }
  .science-section .topic-icon.gold{ background:#b9720a; }
  .science-section .topic-icon svg{ width:20px;height:20px; stroke:#fff; }
  .science-section .topic-head h3{ font-size:15.5px; font-weight:600; color:#001f3f; line-height:1.3;font-family: var(--text-font);letter-spacing: 0; }
  .science-section .topic-card p{ font-size:12.5px; color:#001f3f; line-height:1.5; margin-bottom:16px;font-weight: normal;letter-spacing: 0; }

  .science-section .topic-visual{
    height:130px;
    border-radius:8px;
    margin-bottom:16px;
    position:relative;
    overflow:hidden;
  }
  .science-section .visual-formula{ background:radial-gradient(circle at 30% 30%, #dbe6fb, #aac0ea 70%); }
  .science-section .visual-formula::before,.visual-formula::after{
    content:""; position:absolute; border-radius:50%;
    background:rgba(255,255,255,.55); border:1px solid rgba(255,255,255,.8);
  }
  .science-section .visual-formula::before{ width:70px;height:70px; top:20px; left:20px; }
  .science-section .visual-formula::after{ width:56px;height:56px; bottom:14px; right:24px; }

  .science-section .visual-ingredient{ background:linear-gradient(160deg,#eef3f0,#d9e6da); }
  .science-section .visual-ingredient::before{
    content:""; position:absolute; left:50%; top:10px; transform:translateX(-50%);
    width:3px;height:46px; background:#b9c7bc; border-radius:2px;
  }
  .science-section .visual-ingredient::after{
    content:""; position:absolute; bottom:16px; left:50%; transform:translateX(-50%);
    width:78px;height:34px; border-radius:50%/16px;
    background:rgba(255,255,255,.7); border:1px solid #c7d3c9;
  }

  .science-section .visual-longevity{ background:radial-gradient(circle at 50% 45%, #24407a, #10284d 70%); }
  .science-section .visual-longevity::before{
    content:""; position:absolute; inset:0;
    background-image:
      radial-gradient(circle at 30% 30%, rgba(255,255,255,.9) 0 2px, transparent 3px),
      radial-gradient(circle at 65% 25%, rgba(255,255,255,.7) 0 2px, transparent 3px),
      radial-gradient(circle at 50% 60%, rgba(255,255,255,.9) 0 2px, transparent 3px),
      radial-gradient(circle at 75% 65%, rgba(255,255,255,.6) 0 2px, transparent 3px),
      radial-gradient(circle at 25% 70%, rgba(255,255,255,.7) 0 2px, transparent 3px);
  }

  .science-section .visual-clinical{ background:linear-gradient(160deg,#eaf1fb,#cddbf0); }
  .science-section .visual-clinical::before{
    content:""; position:absolute; bottom:16px; left:26px;
    width:14px;height:60px; background:rgba(255,255,255,.85); border:1px solid #b9c9e2;
    border-radius:0 0 7px 7px;
  }
  .science-section .visual-clinical::after{
    content:""; position:absolute; bottom:16px; left:52px;
    width:14px;height:44px; background:rgba(180,205,235,.9); border:1px solid #b9c9e2;
    border-radius:0 0 7px 7px;
  }

  .science-section .topic-link{
    margin-top:auto;
    font-size:11px; font-weight:800;  color:#001f3f;
    text-decoration:none; display:inline-flex; align-items:center; gap:6px;
  }
  .science-section .topic-link svg{ width:12px;height:12px; stroke:#001f3f; }

  /* ---------- Featured article ---------- */
  .science-section .featured-card{
    background:#fff;
    border:1px solid #eee;
    border-radius:12px;
    padding:16px;
    display:grid;
    grid-template-columns:450px .7fr auto;
    gap:28px;
    align-items:center;
    margin-bottom:0px;
  }
  .science-section .featured-visual{
    height:150px;
    border-radius:8px;
    background:radial-gradient(circle at 30% 20%, #244b8a, #0c1c38 75%);
    position:relative;
    overflow:hidden;
  }
  .science-section .featured-visual .silhouette{
    position:absolute; bottom:0; left:14px;
    width:70px;height:130px;
    background:linear-gradient(180deg,#1a2b47,#0c1424);
    border-radius:35px 35px 0 0;
    opacity:.9;
  }
  .science-section .featured-visual .helix{
    position:absolute; right:10px; top:10px; bottom:10px; width:40px;
    background-image:repeating-linear-gradient(45deg, rgba(120,170,255,.5) 0 2px, transparent 2px 10px);
    opacity:.6;
  }
  .science-section .featured-visual .stat{
    position:absolute; top:12px; left:12px;
    color:#fff; font-size:9px; line-height:1.3;
  }
  .science-section .featured-visual .stat b{ display:block; font-size:15px; font-weight:800; }
  .science-section .featured-visual .stat.stat2{ top:52px; }

  .featured-body{ }
  .science-section .featured-label{
    font-size: 12px;
    font-weight: normal;
    
    color: #b9720a;
    margin-bottom: 3px;
  }
  
  .science-section .featured-card .image {
    height: 210px;
    overflow: hidden;
    border-radius: 15px;
    display: flex;
    align-items: start;
}

.science-section .featured-card .image > img {
    width: 100%;
    position: relative;
    top: -100px;
}
  .science-section .featured-body h3{
    font-size:18px;
    font-weight:600;
    color:#001f3f;
    line-height:1.35;
    margin-bottom:10px;
    /* font-family: 'Playfair Display'; */
    font-family: var(--heading-font);
  }
  .science-section .featured-body p{font-size:12.5px;color:#001f3f;line-height:1.6;font-weight: normal;font-family: var(--text-font);}
    .science-section .featured-card .featured-body {
    border-right: 1px solid #d7d7d7;
}
  .science-section .featured-side{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    border-left: 1px solid var(--border);
    padding-left: 28px;
  }
  .science-section .btn-outline{
    border:1.5px solid #b9720a;
    color:#b9720a;
    background:none;
    border-radius:6px;
    padding:11px 18px;
    font-size:12px; font-weight:400; 
    display:inline-flex; align-items:center; gap:8px;
    cursor:pointer;
    white-space:nowrap;
    font-family:inherit;
  }
  .science-section .btn-outline svg{ width:12px;height:12px; stroke:#b9720a; }
  .science-section .weekly-note{
    display:flex; align-items:center; gap:6px;
    font-size:11px; color:#001f3f;
    white-space:nowrap;
    font-weight: normal;
  }
  .science-section .weekly-note svg{ width:13px;height:13px; stroke:#001f3f; }

  /* ---------- Bottom banner ---------- */
  .science-section .banner{
    font-weight: normal;
    margin:0 -24px;
    padding:20px 24px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    flex-wrap:wrap;
    font-size:14px;
  }
  .science-section .banner .light{ color:#001f3f;     opacity: 1;}
  .science-section .banner .sep{ color:#4f6padding; opacity:.4; }
  .science-section .banner a{
    color:#b9720a;
    font-weight:400;
    
    text-decoration:none;
    display:inline-flex; align-items:center; gap:6px;
  }
  .science-section .banner a svg{ width:12px;height:12px; stroke:#b9720a; }
  

  /* ================= MOBILE ================= */
  @media (max-width:768px){
    .science-section{ padding:40px 16px 0; }
    .science-section h2{ font-size:24px; }
    .science-section .subhead{ font-size:13px; margin-bottom:26px; }
    .science-section .eyebrow{ font-size:10px;  }

    .science-section .topic-grid{ grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
    .science-section .topic-card{ padding:16px 16px 14px; }
    .science-section .topic-head{ display:block; }
    .science-section .topic-icon{ display:none; }
    .science-section .topic-head h3{ font-size:13.5px; }
    .science-section .topic-card p{ font-size:11px; margin-bottom:12px; }
    
    .science-section .topic-visual{ display:none; }
    .science-section .topic-link{ font-size:10px; }

    .science-section .featured-card{
      grid-template-columns:1fr;
      padding:14px;
      gap:14px;
      padding: 20px;
    }
    .science-section .featured-visual{ height:170px; }
    .science-section .featured-side{
      border-left:none; padding-left:0; align-items:stretch;
      border-top:1px solid var(--border); padding-top:14px;
    }
    .science-section .btn-outline{ justify-content:center; }
    .science-section .weekly-note{ justify-content:center; }
    .science-section .featured-body h3{ font-size:16px; }

    .science-section .banner{
      flex-direction:column; text-align:center; gap:8px;
      margin:0 -16px; border-radius:0;
    }
    .science-section .banner .sep{ display:none; }
  }

@media (max-width: 600px) {
    .exists-section {
        padding: 60px 15px;
    }

    .exists-title {
        font-size: 32px;
    }

    .exists-desc-text {
        font-size: 15px;
        padding: 0 15px;
    }

    .exists-columns-block {
        background: #001c44 !important;
        /* Deep navy blue matching the image */
        border-radius: 8px;
        padding: 40px 50px !important;
        /* Room for content and arrows */
        position: relative;
        display: block !important;
        width: 100% !important;
        border: none !important;
        max-width: 380px;
    }

    .exists-columns-block .slick-list {
        overflow: hidden;
        width: 100%;
    }

    .exists-columns-block .slick-track {
        display: flex !important;
        align-items: center;
    }

    .exists-columns-block .slick-slide {
        border-left: none !important;
        display: block !important;
    }

    .exists-columns-block .slick-slide .exists-column {
        border-left: none !important;
    }

    .exists-column {
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        text-align: left !important;
        gap: 25px !important;
        width: 100% !important;
        transform: none !important;
    }

    .exists-column:hover {
        transform: none !important;
    }

    .exists-col-icon-wrapper {
        flex: 0 0 90px !important;
        height: 90px !important;
        margin-bottom: 0 !important;
        background: transparent !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .exists-column {
        gap: 10px !important;
    }

    .exists-col-icon {
        height: 90px !important;
        width: 90px !important;
        object-fit: contain;
        filter: none !important;
    }

    .exists-col-text-wrapper {
        align-items: flex-start !important;
        text-align: left !important;
        gap: 4px;
    }

    .exists-col-title {
        color: #ffffff !important;
        font-size: 22px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        margin-bottom: 0 !important;
        height: auto !important;
        justify-content: flex-start !important;
        text-align: left !important;
    }

    .exists-col-line {
        display: none !important;
        /* Hide gold divider line on mobile */
    }

    .exists-col-subtitle {
        color: #ffffff !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        margin-bottom: 0 !important;
        height: auto !important;
        justify-content: flex-start !important;
        text-align: left !important;
    }

    .exists-col-body {
        color: rgba(255, 255, 255, 0.85) !important;
        font-size: 13px !important;
        line-height: 1.4 !important;
        font-weight: 400 !important;
    }

    /* Slick navigation styling matching the mockup */
    .exists-columns-block .slick-prev,
    .exists-columns-block .slick-next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background: transparent !important;
        border: none !important;
        color: #ffffff !important;
        font-size: 36px !important;
        line-height: 1 !important;
        padding: 10px !important;
        cursor: pointer;
        z-index: 10;
        transition: opacity var(--transition-speed) ease, transform 0.2s ease;
    }

    .exists-columns-block .slick-prev {
        left: 10px;
    }

    .exists-columns-block .slick-next {
        right: 10px;
    }

    .exists-columns-block .slick-prev:hover,
    .exists-columns-block .slick-next:hover {
        opacity: 0.8;
    }

    .exists-columns-block .slick-prev:active,
    .exists-columns-block .slick-next:active {
        transform: translateY(-50%) scale(0.9);
    }

    .exists-sphere-img {
        width: 220px;
    }

    .exists-bottom-card .card-text-blue {
        font-size: 16px;
    }

    .hero-features {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .hero-features .feature-card {
        flex-direction: row;
        text-align: left;
    }

    .exists-header.desktop {
        display: none;
    }

    .exists-header.mobile {
        display: block;
    }

    .exists-sphere-block {
        position: relative;
        max-width: 100%;
        right: auto;
        left: auto;
    }

    .exists-content-wrapper {
        grid-template-columns: 1fr;
        padding-right: 0;
        gap: 20px 0;
    }

    .exists-bottom-card {
        display: none;
    }

    .exists-sphere-img {
        width: 100%;
    }

    section.exists-section {
        padding: 0;
        width: 100%;
    }

    .exists-header {
        padding: 0;
        margin: 0;
    }

    .exists-columns-block-bg {
        background: #001c44 !important;
        border-radius: 8px;
    }

    .exists-columns-block .slick-next {}

    .exists-columns-block .slick-next::before,
    .exists-columns-block .slick-prev:before {
        display: none;
    }

    .exists-columns-block i.fa-solid {
        font-size: 24px;
    }

    .exists-col-subtitle br {
        display: none;
    }

    p.exists-col-body br {
        display: none;
    }

    p.exists-col-body {
        padding-right: 56px;
    }
    
    

    .newsletter-form input {
        width: auto;
    }

    h2.process-title {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding: 0 20px;
        font-size: 32px;
    }

    h2.process-title br {
        display: none;
    }


    h2.process-title br {
        display: none;
    }

    .process-section h3.step-title {
        color: var(--accent-gold);
        font-family: 'Playfair Display';
        font-size: 22px;
        letter-spacing: 0;
        line-height: normal;
        margin: 0 0 5px 0;
    }

    .process-section span.step-number {
        color: var(--accent-gold);
        font-family: 'Playfair Display';
        font-size: 24px;
        letter-spacing: 0;
        margin-bottom: 0;
        padding: 0;
        line-height: normal;
    }

    .process-section span.step-underline {
        display: none;
    }

    .process-section p.step-desc {
        font-size: 18px;
        line-height: 21px;
        margin: 0;
        color: #02205f;
    }

    .process-section .step-image {
        border: 1px solid #02205f;
    }

    .process-section .compare-body {
        min-height: 130px;
    }

    .process-section .compare-item {
        background: #fafafa;
        border: 1px solid #eee;
    }

    .process-section .process-compare {
        border: 0;
        background: transparent;
        margin: 0 0 60px 0;
        padding: 0;
    }

    .process-section .process-steps {
        margin-bottom: 40px;
    }

    .compare-body {
        min-height: 130px;
    }

    .compare-item {
        background: #fafafa;
        border: 1px solid #eee;
    }

    .process-compare {
        border: 0;
        background: transparent;
        margin: 0 0 60px 0;
        padding: 0;
    }

    .process-steps {
        margin-bottom: 40px;
    }

    .process-compare .compare-title {
        color: var(--accent-gold);
        font-family: 'Playfair Display';
        font-size: 19px;
        line-height: 20px;
    }

    .process-compare .compare-title::after {
        display: none;
    }

    section.process-section {
        background: #fff;
    }

    section.follow-section {
        padding-top: 40px;
        background: #001a66;
    }

    section.follow-section h2.process-title .text-blue,
    section.follow-section h2.process-title .text-gold,
    section.follow-section .process-subtitle,
    section.follow-section span.step-number,
    section.follow-section h3.step-title,
    section.follow-section p.step-desc {
        color: #fff;
    }

    section.follow-section .@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

    :root {
        --bg-dark: #000d22;
        --text-light: #ffffff;
        --text-muted: #a0aec0;
        --accent-gold: #d3933e;
        --accent-gold-hover: #d3933e;
        --border-color: rgba(255, 255, 255, 0.1);
        --transition-speed: 0.3s;
    }

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

    body {
        /*font-family: 'Inter', sans-serif;*/
        font-family: var(--text-font);
        color: var(--text-light);
        background-color: var(--text-light);
        /* Assuming the main page body might be light, footer is dark */
        line-height: 1.6;
    }

    a {
        text-decoration: none;
        color: inherit;
        transition: color var(--transition-speed) ease;
    }

    ul {
        list-style: none;
    }

    /* --- HEADER SECTION --- */
    .main-header {
        background-color: #ffffff;
        color: #333;
        padding: 20px 40px;
        border-bottom: 1px solid #eaeaea;
        position: sticky;
        top: 0;
        z-index: 1000;
    }

    .header-container {
        max-width: 1400px;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .header-left {
        display: flex;
        align-items: center;
        gap: 40px;
    }

    .logo-img {
        height: 40px;
        transition: transform var(--transition-speed) ease;
    }

    .logo-img:hover {
        transform: scale(1.05);
    }

    .main-nav ul {
        display: flex;
        gap: 30px;
    }

    .main-nav a {
        font-size: 16px;
        font-weight: 500;
        color: #555;
        position: relative;
    }

    .main-nav a:hover,
    .main-nav a.active {
        color: #111;
    }

    .main-nav a::after {
        content: '';
        position: absolute;
        width: 0;
        height: 2px;
        bottom: -4px;
        left: 0;
        background-color: #111;
        transition: width var(--transition-speed) ease;
    }

    .main-nav a:hover::after,
    .main-nav a.active::after {
        width: 100%;
    }

    .header-right {
        display: flex;
        gap: 25px;
    }

    .icon-link {
        font-size: 20px;
        color: #555;
        transition: color var(--transition-speed) ease, transform 0.2s ease;
    }

    .icon-link:hover {
        color: #111;
        transform: translateY(-2px);
    }



    /* --- FOOTER SECTION --- */
    .main-footer {
        background-color: var(--bg-dark);
        color: var(--text-light);
        padding: 60px 24px 20px;
        font-size: 14px;
    }

    .footer-container {
        max-width: 1400px;
        margin: 0 auto;
    }

    .footer-top {
        display: grid;
        grid-template-columns: 1fr 1.5fr 1fr;
        gap: 40px;
        align-items: center;
        margin-bottom: 50px;
    }

    .footer-brand .footer-logo {
        height: auto;
        /*filter: brightness(0) invert(1);*/
    }

    .footer-tagline {
        font-size: 24px;
        font-weight: 300;
        border-left: 0px solid var(--accent-gold);
        padding-left: 0px;
    }

    .footer-tagline p {
        margin-bottom: 5px;
        font-weight: 500;
    }

    .tagline-highlight {
        color: var(--accent-gold);
        font-weight: 500;
    }

    .footer-newsletter h4 {
        color: var(--accent-gold);
        font-size: 14px;
        margin-bottom: 10px;
        
    }

    .footer-newsletter p {
        margin-bottom: 20px;
        color: var(--text-muted);
    }

    .newsletter-form {
        display: flex;
        align-items: center;
    }

    .newsletter-form input {
        background: transparent;
        border: 1px solid var(--border-color);
        padding: 12px 15px;
        color: var(--text-light);
        width: 250px;
        outline: none;
        border-radius: 4px 0 0 4px;
        transition: border-color var(--transition-speed) ease;
    }

    .newsletter-form input:focus {
        border-color: var(--accent-gold);
    }

    .newsletter-form button {
        background-color: var(--accent-gold);
        color: var(--bg-dark);
        border: none;
        padding: 13px 20px;
        font-weight: 600;
        cursor: pointer;
        border-radius: 0 4px 4px 0;
        transition: background-color var(--transition-speed) ease, transform 0.2s ease;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .newsletter-form button:hover {
        background-color: var(--accent-gold-hover);
    }

    .footer-divider {
        border: none;
        border-top: 1px solid var(--border-color);
        margin: 40px 0;
    }

    .footer-divider-subtle {
        border: none;
        border-top: 1px solid rgba(255, 255, 255, 0.05);
        margin: 40px 0;
    }

    .footer-middle {
        display: grid;
        grid-template-columns: repeat(5, 1fr) 1.5fr;
        gap: 30px;
    }

    .footer-links-col h4,
    .footer-connect-col h4 {
        color: var(--accent-gold);
        font-size: 14px;
        margin-bottom: 20px;
        
        text-transform: uppercase;
    }

    .footer-links-col ul li {
        margin-bottom: 12px;
    }

    .footer-links-col ul li a {
        color: var(--text-muted);
        font-size: 14px;
        position: relative;
        transition: all var(--transition-speed) ease;
    }

    .footer-links-col ul li a:hover {
        color: var(--text-light);
        padding-left: 5px;
        /* Smooth slide right animation on hover */
    }

    .footer-connect-col {
        border-left: 1px solid var(--border-color);
        padding-left: 40px;
    }

    .social-icons {
        display: flex;
        gap: 15px;
        flex-wrap: wrap;
        margin-bottom: 30px;
    }

    .social-icons a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border: 1px solid var(--accent-gold);
        border-radius: 50%;
        color: var(--accent-gold);
        font-size: 16px;
        transition: all var(--transition-speed) ease;
    }

    .social-icons a:hover {
        background-color: var(--accent-gold);
        color: var(--bg-dark);
        transform: translateY(-3px);
    }

    .secure-checkout {
        display: flex;
        align-items: center;
        gap: 15px;
        color: var(--text-muted);
    }

    .secure-checkout i {
        font-size: 24px;
        color: var(--accent-gold);
    }

    .secure-checkout div {
        display: flex;
        flex-direction: column;
    }

    .footer-bottom {
        display: flex;
        flex-direction: column;
        gap: 30px;
    }

    .features-row {
        display: flex;
        justify-content: space-between;
        padding-bottom: 30px;
        border-bottom: 1px solid var(--border-color);
    }

    .feature-item {
        display: flex;
        align-items: center;
        gap: 15px;
        color: var(--text-muted);
    }

    .feature-item i {
        font-size: 24px;
        color: var(--accent-gold);
    }

    .copyright-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: var(--text-muted);
    }

    .legal-links {
        display: flex;
        gap: 20px;
    }

    .legal-links a {
        color: var(--accent-gold);
    }

    .legal-links a:hover {
        color: var(--accent-gold-hover);
        text-decoration: underline;
    }

    .footer-tagline-bottom {
        text-align: center;
        margin-top: 40px;
        color: var(--text-muted);
        font-size: 12px;
        
        text-transform: uppercase;
    }
    
    

    /* Responsive adjustments */
    @media (max-width: 1024px) {
        .footer-top {
            grid-template-columns: 1fr;
            text-align: center;
            display: flex;
            flex-direction: column;
        }

        .footer-tagline {
            border-left: none;
            padding-left: 0;
            border-top: 1px solid var(--accent-gold);
            border-bottom: 1px solid var(--accent-gold);
            padding: 20px 0;
        }

        .footer-middle {
            grid-template-columns: repeat(3, 1fr);
        }

        .footer-connect-col {
            border-left: none;
            padding-left: 0;
            grid-column: span 3;
            margin-top: 20px;
        }

        .features-row {
            flex-wrap: wrap;
            gap: 20px;
            justify-content: center;
        }
    }

    @media (max-width: 768px) {
        .header-left {
            gap: 20px;
        }

        .main-nav {
            display: none;
            /* simple mobile hide for now */
        }

        .footer-middle {
            grid-template-columns: 1fr 1fr;
        }

        .footer-connect-col {
            grid-column: span 2;
        }

        .copyright-row {
            flex-direction: column;
            gap: 15px;
            text-align: center;
        }
    }

    /* --- HERO SECTION --- */
    .hero-section {
        background: linear-gradient(135deg, #fdfdff 0%, #edf2f7 100%);
        padding: 80px 40px;
        overflow: hidden;
        color: #112a46;
        background: #fbfbfb;
        padding: 0px 0px 0px 40px;
    }

    .hero-container {
        max-width: 1400px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        
    }

    .hero-left {
        flex: 1;
        max-width: 650px;
        animation: fadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
        opacity: 0;
        transform: translateY(30px);
    }

    .hero-title {
        font-family: var(--heading-font);
        font-size: 64px;
        line-height: 1.1;
        margin-bottom: 25px;
        font-weight: 600;
    }

    .hero-title .text-blue {
        color: #001f3f;
    }

    .hero-title .text-gold {
        color: #b9720a;
    }

    .hero-subtitle {
        font-size: 22px;
        color: #001f3f;
        margin-bottom: 40px;
        line-height: 1.6;
        font-weight: 400;
    }

    .hero-features {
        display: flex;
        gap: 25px;
        margin-bottom: 50px;
    }

    .feature-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 15px;
    }

    .feature-card img {
        height: 75px;
        width: auto;
        mix-blend-mode: multiply;
        transition: transform 0.3s ease;
    }

    .feature-card:hover img {
        transform: translateY(-5px);
    }

    .feature-card span {
        font-size: 13px;
        font-weight: normal;
        color: #001f3f;
        
        text-transform: uppercase;
    }

    .hero-actions {
        display: flex;
        gap: 20px;
    }

    .btn {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        padding: 15px 30px;
        font-size: 13px;
        font-weight: 600;
        
        text-transform: uppercase;
        text-decoration: none;
        border-radius: 4px;
        transition: all 0.3s ease;
    }

    .btn-primary {
        background-color: #001f3f;
        color: #fff;
        border: 2px solid #001f3f;
    }

    .btn-primary:hover {
        background-color: #000;
        border-color: #000;
        color: #fff;
        transform: translateY(-2px);
        box-shadow: 0 10px 20px rgba(0, 31, 63, 0.15);
    }

    .btn-secondary {
        background-color: transparent;
        color: #b9720a;
        border: 2px solid #b9720a;
    }

    .btn-secondary:hover {
        background-color: #b9720a;
        color: #fff;
        transform: translateY(-2px);
        box-shadow: 0 10px 20px rgba(201, 138, 48, 0.15);
    }

    .hero-right {
        flex: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        animation: fadeLeft 1.2s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
        opacity: 0;
        transform: translateX(40px);
    }

    .hero-image-wrapper {
        position: relative;
        width: 100%;
        max-width: 600px;
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }

    .liposome-bg {
        /*position: absolute;*/
        /*width: 140%;
    max-width: 750px;*/
        /*left: -40%;*/
        top: 50%;
        transform: translateY(0%);
        z-index: 1;
        /*animation: pulseFloat 8s ease-in-out infinite alternate;*/
        mix-blend-mode: multiply;
    }

    .product-bottle {
        position: relative;
        z-index: 2;
        width: 55%;
        max-width: 320px;
        filter: drop-shadow(20px 20px 30px rgba(0, 0, 0, 0.15));
        animation: float 5s ease-in-out infinite;
        margin-right: 20px;
    }

    @media screen and (min-width:1600px) {
        .hero-section {
            background: linear-gradient(135deg, #fdfdff 0%, #edf2f7 100%);
            padding: 0px 0px 0px 40px;
            overflow: hidden;
            color: #112a46;
            background: #fbfbfb;
        }

        .hero-container {
            max-width: none;
            margin: 0 auto;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 40px;
        }

        .hero-left {
            flex: 1;
            max-width: 650px;
            animation: fadeUp 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
            opacity: 0;
            transform: translateY(30px);
            /*position: absolute;
        left: 13%;*/
        }

        .hero-right {
            justify-content: end;
        }
    }

    @media screen and (max-width:1550px) {
        .liposome-bg {
            width: 140%;
            max-width: 750px;
        }
    }


    /* Animations */
    @keyframes fadeUp {
        from {
            opacity: 0;
            transform: translateY(30px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    @keyframes fadeLeft {
        from {
            opacity: 0;
            transform: translateX(40px);
        }

        to {
            opacity: 1;
            transform: translateX(0);
        }
    }

    @keyframes float {
        0% {
            transform: translateY(0px);
        }

        50% {
            transform: translateY(-15px);
        }

        100% {
            transform: translateY(0px);
        }
    }

    @keyframes pulseFloat {
        0% {
            transform: translateY(-50%) scale(1);
        }

        100% {
            transform: translateY(-50%) scale(1.05);
        }
    }

    /* Responsive HERO */
    @media (max-width: 1100px) {
        .hero-features {
            flex-wrap: wrap;
        }

        .liposome-bg {
            width: 120%;
            left: -20%;
        }
    }

    @media (max-width: 1024px) {
        .section-header.shopify-section-group-header-group {
    z-index: 9999;
}
        .hero-section {
            padding: 0;
            padding: 0 0 35px 0;
        }

        .hero-container {
            flex-direction: column-reverse;
            text-align: center;
        }

        .hero-left {
            max-width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .hero-features {
            justify-content: center;
        }

        .hero-right {
            margin-top: 0px;
            width: 100%;
        }

        .hero-image-wrapper {
            justify-content: center;
        }

        .liposome-bg {
            width: 100%;
            left: 0;
            max-width: 100%;
            opacity: 0.8;
        }

        .product-bottle {
            margin-right: 0;
        }
    }

    @media (max-width: 768px) {
        .hero-title {
            font-size: 40px;
        }

        .hero-actions {
            flex-direction: column;
            width: 100%;
            max-width: 350px;
        }

        .btn {
            justify-content: center;
        }
    }

    /* --- WHY LIPOCENTRIC EXISTS SECTION --- */
    .exists-section {
        background: linear-gradient(180deg, #ffffff 0%, #f7f9fb 100%);
        position: relative;
        padding: 0px 40px;
        overflow: hidden;
        color: #112a46;
    }

    /* Background glow behind the sphere */
    .exists-section::after {
        content: '';
        position: absolute;
        top: 25%;
        right: -5%;
        width: 600px;
        height: 600px;
        background: radial-gradient(circle, rgba(201, 138, 48, 0.05) 0%, rgba(255, 255, 255, 0) 70%);
        z-index: 1;
        pointer-events: none;
    }

    .exists-container {
        max-width: none;
        margin: 0 auto;
        position: relative;
        z-index: 2;
    }

    /* Header */
    .exists-header {
        margin-bottom: 60px;
        text-align: center;
        padding-top: 70px;
    }

    .exists-subtitle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 15px;
    }

    .exists-subtitle .line {
        display: inline-block;
        height: 1px;
        width: 50px;
        background-color: var(--accent-gold);
        opacity: 0.5;
    }

    .exists-sub-icon {
        width: 22px;
        height: 22px;
    }

    .exists-subtitle .subtitle-text {
        font-family: var(--text-font);
        font-size: 13px;
        font-weight: 600;
        
        color: var(--accent-gold);
        text-transform: uppercase;
    }

    /* Content Wrapper */
    .exists-content-wrapper {
        display: flex;
        justify-content: space-between;
        align-items: stretch;
        gap: 0px;
        display: grid;
        grid-template-columns: 1fr, 1fr, 1fr;
        grid-template-columns: .9fr 1fr;
        /*padding-right: calc(-40vw + 70%);*/
    }

    /* Left Info Block */
    .exists-info-block {
        flex: 0 0 28%;
        max-width: 480px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .exists-title {
        font-family: var(--heading-font);
        font-size: 42px;
        line-height: 1.2;
        font-weight: 600;
        color: #001f3f;
        margin-bottom: 0;
    }

    .exists-title .text-gold-gradient {
        background: linear-gradient(135deg, #b9720a 0%, #e2ab55 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        display: inline-block;
    }

    .exists-desc-divider {
        display: flex;
        align-items: center;
        gap: 10px;
        margin: 25px 0;
    }

    .exists-desc-divider .divider-line {
        height: 1px;
        width: 35px;
        background-color: var(--accent-gold);
        opacity: 0.4;
    }

    .exists-desc-divider .divider-hexagon {
        width: 8px;
        height: 8px;
        border: 1px solid var(--accent-gold);
        transform: rotate(45deg);
    }

    .exists-desc-text {
        font-family: var(--text-font);
        font-size: 16px;
        line-height: 1.6;
        color: #02205f;
        font-weight: 400;
    }

    .exists-desc-text .highlight-gold {
        color: #b9720a;
        font-weight: 600;
    }

    /* Middle Columns Block */
    .exists-columns-block {
        flex: 1;
    }

   /* .exists-columns-block:not(.slick-initialized) {
        display: flex;
        justify-content: space-between;
    }

    .exists-columns-block:not(.slick-initialized)>.exists-column {
        flex: 1;
    }

    .exists-columns-block.slick-slider .slick-track {
        display: flex !important;
        align-items: stretch;
    }

    .exists-columns-block.slick-slider .slick-slide {
        display: flex !important;
        flex-direction: column;
        height: auto;
    }

    .exists-columns-block.slick-slider .slick-slide[data-slick-index="0"] .exists-column {
        border-left: none !important;
    }*/

    .exists-col-text-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    }

    .exists-column {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 20px 15px;
        border-left: 1px solid rgba(0, 31, 63, 0.08);
        transition: transform var(--transition-speed) cubic-bezier(0.2, 0.8, 0.2, 1), opacity var(--transition-speed) ease;
    }

    .exists-column:hover {
        transform: translateY(-8px);
    }

    .exists-col-icon-wrapper {
        height: 70px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 20px;
    }

    .exists-col-icon {
        height: 60px;
        width: auto;
        object-fit: contain;
        /*transition: transform var(--transition-speed) ease;*/
    }

    .exists-column:hover .exists-col-icon {
        /*transform: scale(1.1);*/
    }

    .exists-col-title {
        font-family: var(--text-font);
        font-size: 13px;
        font-weight: 700;
        
        line-height: 1.3;
        color: #001f3f;
        text-transform: uppercase;
        margin-bottom: 12px;
        height: 34px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .exists-col-line {
        width: 25px;
        height: 2px;
        background-color: var(--accent-gold);
        margin: 0 auto 15px;
    }

    .exists-col-subtitle {
        font-family: var(--text-font);
        font-size: 13px;
        font-weight: 600;
        color: var(--accent-gold);
        line-height: 1.3;
        margin-bottom: 12px;
        height: 34px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .exists-col-body {
        font-family: var(--text-font);
        font-size: 14px;
        line-height: 1.3;
        color: #02205f;
        font-weight: 400;
    }

    /* Right Sphere Block */
    .exists-sphere-block {
        flex: 0 0 20%;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        position: relative;
        margin-right: calc(-50vw + 50%);
        position: absolute;
        right: 0;
        top: 0;
    }

    .exists-sphere-container {
        position: relative;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .exists-sphere-img {
        width: 100%;
        height: auto;
        z-index: 2;
        mix-blend-mode: multiply;
        /*animation: floatSphere 6s ease-in-out infinite;*/
    }

    .exists-sphere-shadow {
        position: absolute;
        bottom: -20px;
        width: 160px;
        height: 20px;
        background: radial-gradient(ellipse at center, rgba(0, 13, 34, 0.12) 0%, rgba(0, 13, 34, 0) 70%);
        z-index: 1;
        filter: blur(4px);
        animation: shadowPulse 6s ease-in-out infinite;
        pointer-events: none;
    }

    /* Bottom Highlight Card */
    .exists-bottom-card {
        background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(247, 249, 251, 0.9) 100%);
        border: 1px solid rgba(201, 138, 48, 0.15);
        box-shadow: 0 15px 35px rgba(0, 13, 34, 0.04);
        border-radius: 12px;
        padding: 22px 50px;
        margin-top: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 30px;
        backdrop-filter: blur(5px);
        transition: transform var(--transition-speed) ease, box-shadow var(--transition-speed) ease;
        max-width: 1000px;
        margin: 90px auto 0;
        position: relative;
        top: -50px
    }

    .exists-bottom-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 20px 40px rgba(0, 13, 34, 0.08);
    }

    .exists-bottom-card .card-left {
        display: flex;
        align-items: center;
        gap: 15px;
    }

    .exists-bottom-card .card-icon {
        height: 48px;
        width: auto;
        object-fit: contain;
    }

    .exists-bottom-card .card-text-blue {
        font-family: var(--heading-font);
        font-size: 24px;
        font-weight: 400;
        color: #001f3f;
        
    }

    .exists-bottom-card .card-text-blue .text-gold {
        color: #b9720a;
    }

    .exists-bottom-card .card-text-blue .font-bold {
        font-weight: 700;
    }

    .exists-bottom-card .card-divider {
        width: 1px;
        height: 35px;
        background-color: rgba(0, 31, 63, 0.12);
    }

    .exists-bottom-card .card-right {
        display: flex;
        align-items: center;
    }

    /* Carousel dots (hidden on desktop) */
    .exists-carousel-dots {
        display: none;
    }

    /* ============================================================
   PROCESS SECTION
   Append to style.css. Uses existing tokens:
   --accent-gold, Playfair Display, Jost.
   ============================================================ */

    .process-section {
        background-color: #ffffff;
        color: #02205f;
        padding: 100px 40px 0;
        background: #fafafb;
    }

    .process-container {
        max-width: 1400px;
        margin: 0 auto;
        text-align: center;
    }

    /* -- Heading -- */
    .process-title {
        font-family: var(--heading-font);
        font-weight: 500;
        font-size: 48px;
        line-height: 1.2;
        
        margin: 0 auto;
        max-width: 900px;
    }

    .process-title .text-blue {
        color: #02205f;
    }

    .process-title .text-gold {
        color: var(--accent-gold);
        font-weight: 500;
    }

    /* -- Divider with hex -- */
    .process-divider {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        margin: 22px auto 18px;
        color: var(--accent-gold);
    }

    .process-divider .line {
        display: block;
        width: 60px;
        height: 1px;
        background-color: var(--accent-gold);
        opacity: 0.7;
    }

    .process-divider .hex {
        display: inline-flex;
    }

    .process-subtitle {
        font-size: 16px;
        color: #02205e;
        max-width: 620px;
        margin: 0 auto 70px;
        line-height: 1.6;
    }

    /* -- Steps row -- */
    .process-steps {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 10px;
        margin-bottom: 90px;
    }

    .process-step {
        flex: 1 1 0;
        max-width: 300px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .step-image {
        width: 100%;
        aspect-ratio: 1 / 1;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 24px;
    }

    .step-image img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .step-body {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .step-number {
        font-size: 14px;
        color: var(--accent-gold);
        
        margin-bottom: 10px;
    }

    .step-title {
        font-family: var(--text-font);
        font-size: 15px;
        font-weight: 600;
        
        color: #02205f;
        margin: 0 0 8px;
    }

    .step-underline {
        display: block;
        width: 34px;
        height: 2px;
        background-color: var(--accent-gold);
        margin-bottom: 14px;
    }

    .step-desc {
        font-size: 16px;
        color: #02205f;
        line-height: 1.4;
        margin: 0;
    }

    .process-arrow {
        color: #02205f;
        padding-top: 90px;
        /* vertically align with middle of images */
        flex: 0 0 auto;
    }

    /* -- Comparison bar -- */
    .process-compare {
        display: grid;
        grid-template-columns: 1fr .5fr 1fr;
        align-items: center;
        gap: 30px;
        background-color: #fafafb;
        padding: 34px 40px;
        border-top: 1px solid #e2e2e2;
        border-bottom: 0px solid #02205f;
        display: flex;
        justify-content: space-between;
    }

    .compare-item {
        display: flex;
        align-items: center;
        gap: 22px;
        text-align: left;
    }

    .process-compare .compare-item:last-of-type {
        justify-content: flex-start;
    }

    .compare-icon {
        width: 62px;
        height: 62px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 62px;
    }

    .compare-icon-plain {
        border: 1px solid #02205f;
        color: #02205f;
    }

    .compare-icon-gold {
        border: 1px solid var(--accent-gold);
        color: var(--accent-gold);
    }

    .compare-body p {
        margin: 2px 0;
        font-size: 14px;
        color: #02205f;
        line-height: 1.55;
    }

    .compare-emphasis {
        color: #02205f !important;
        font-weight: 600;
    }

    .compare-title {
        font-family: var(--text-font);
        font-size: 16px;
        font-weight: 600;
        
        margin: 0 0 6px;
        position: relative;
        padding-bottom: 8px;
    }

    .compare-title::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        width: 34px;
        height: 2px;
        background-color: var(--accent-gold);
    }

    .compare-title-muted {
        color: #02205f;
    }

    .compare-title-gold {
        color: var(--accent-gold);
    }

    .compare-divider {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #02205f;
        border-left: 1px solid #E8D6B3;
        border-right: 1px solid #E8D6B3;
        justify-content: center
    }

    .compare-divider .line {
        display: block;
        width: 30px;
        height: 1px;
        background-color: #02205f;
    }


    /*=========== follow section css =============*/




    .follow-section {
        background-color: #ffffff;
        color: #02205f;
        padding: 100px 40px 0;
        background: #fafafb;
    }

    .follow-container {
        max-width: 1400px;
        margin: 0 auto;
        text-align: center;
    }

    /* -- Heading -- */
    .follow-title {
        font-family: var(--heading-font);
        font-weight: 500;
        font-size: 48px;
        line-height: 1.2;
        
        margin: 0 auto;
        max-width: 900px;
    }

    .follow-title .text-blue {
        color: #02205f;
    }

    .follow-title .text-gold {
        color: var(--accent-gold);
        font-style: italic;
        font-weight: 500;
    }

    /* -- Divider with hex -- */
    .follow-divider {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        margin: 22px auto 18px;
        color: var(--accent-gold);
    }

    .follow-divider .line {
        display: block;
        width: 60px;
        height: 1px;
        background-color: var(--accent-gold);
        opacity: 0.7;
    }

    .follow-divider .hex {
        display: inline-flex;
    }

    .follow-subtitle {
        font-size: 16px;
        color: #02205e;
        max-width: 620px;
        margin: 0 auto 70px;
        line-height: 1.6;
    }

    /* -- Steps row -- */
    .follow-steps {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 10px;
        margin-bottom: 90px;
    }

    .follow-step {
        flex: 1 1 0;
        max-width: 300px;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .step-image {
        width: 100%;
        aspect-ratio: 1 / 1;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 24px;
    }

    .step-image img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .step-body {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .step-number {
        font-size: 14px;
        color: var(--accent-gold);
        
        margin-bottom: 10px;
    }

    .step-title {
        font-family: var(--text-font);
        font-size: 15px;
        font-weight: 600;
        
        color: #02205f;
        margin: 0 0 8px;
    }

    .step-underline {
        display: block;
        width: 34px;
        height: 2px;
        background-color: var(--accent-gold);
        margin-bottom: 14px;
    }

    .step-desc {
        font-size: 16px;
        color: #02205f;
        line-height: 1.4;
        margin: 0;
    }

    .follow-arrow {
        color: #02205f;
        padding-top: 90px;
        /* vertically align with middle of images */
        flex: 0 0 auto;
    }

    /* -- Comparison bar -- */
    .follow-compare {
        display: grid;
        grid-template-columns: 1fr .5fr 1fr;
        align-items: center;
        gap: 30px;
        background-color: #fafafb;
        padding: 34px 40px;
        border-top: 1px solid #e2e2e2;
        border-bottom: 0px solid #02205f;
    }

    .compare-item {
        display: flex;
        align-items: center;
        gap: 22px;
        text-align: left;
    }

    .follow-compare .compare-item:last-of-type {
        justify-content: flex-start;
    }

    .compare-icon {
        width: 62px;
        height: 62px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 62px;
    }

    .compare-icon-plain {
        border: 1px solid #02205f;
        color: #02205f;
    }

    .compare-icon-gold {
        border: 1px solid var(--accent-gold);
        color: var(--accent-gold);
    }

    .compare-body p {
        margin: 2px 0;
        font-size: 14px;
        color: #02205f;
        line-height: 1.55;
    }

    .compare-emphasis {
        color: #02205f !important;
        font-weight: 600;
    }

    .compare-title {
        font-family: var(--text-font);
        font-size: 16px;
        font-weight: 600;
        
        margin: 0 0 6px;
        position: relative;
        padding-bottom: 8px;
    }

    .compare-title::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: 0;
        width: 34px;
        height: 2px;
        background-color: var(--accent-gold);
    }

    .compare-title-muted {
        color: #02205f;
    }

    .compare-title-gold {
        color: var(--accent-gold);
    }

    .compare-divider {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #02205f;
        border-left: 1px solid #E8D6B3;
        border-right: 1px solid #E8D6B3;
        justify-content: center
    }

    .compare-divider .line {
        display: block;
        width: 30px;
        height: 1px;
        background-color: #02205f;
    }

    /*=========== follow section css===========*/

    .benefits-bar {
        max-width: 1240px;
        margin: 0 auto;
        background: #fff;
        border-radius: 15px;
        padding: 22px 20px;
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 24px;
        box-shadow: 0 6px 30px rgba(11, 37, 69, .06);
    }

    .benefit {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 8px 10px;
    }

    .benefit+.benefit {
        border-left: 1px solid #e6e2d6;
        padding-left: 24px;
    }

    .benefit-icon {
        flex: 0 0 auto;
        width: 60px;
        height: 60px;
        border-radius: 50%;
        border: 1.5px solid var(--ring);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #001f3f;
    }

    .benefit-icon svg {
        width: 28px;
        height: 28px;
        stroke: #001f3f;
        fill: none;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round
    }

    .benefit-title {
        font-weight: 700;
        font-size: 14px;
        
        text-transform: uppercase;
        color: #001f3f;
        margin: 0 0 6px;
    }

    .benefit-text {
        font-size: 14px;
        line-height: 1.5;
        color: #1c3a66;
        margin: 0;
    }

    .benefit-info {
        text-align: left;
    }

    .benefit-info h3.benefit-title {
        font-size: 12px;
    }

    .benefit-icon img {
        max-width: 70px;
    }

    .benefit+.benefit {
        gap: 10px;
    }

    .benefits-bar.exists-bottom-card {
        gap: 0;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(247, 249, 251, 0.9) 100%);
        border: 1px solid rgba(201, 138, 48, 0.15);
        box-shadow: 0 15px 35px rgba(0, 13, 34, 0.04);
    }

    @media (max-width:960px) {
        .benefits-bar {
            grid-template-columns: 1fr 1fr;
            border-radius: 36px;
            padding: 24px;
            gap: 20px 24px;
        }

        .benefit+.benefit {
            border-left: none;
            padding-left: 10px
        }

        .benefit:nth-child(even) {
            border-left: 1px solid #e6e2d6;
            padding-left: 24px
        }

        .benefit:nth-child(n+3) {
            border-top: 1px solid #e6e2d6;
            padding-top: 20px
        }
    }

    @media (max-width:520px) {

        .benefits-bar {
            grid-template-columns: 1fr;
            border-radius: 28px;
            padding: 20px;
        }

        .benefit+.benefit {
            border-left: none;
            padding-left: 10px;
            border-top: 1px solid #e6e2d6;
            padding-top: 20px
        }

        .benefit:nth-child(even) {
            border-left: none;
            padding-left: 10px
        }
    }


    /* ============================================================
   RESPONSIVE — Tablet
   ============================================================ */
    @media (max-width: 992px) {
        .process-section {
            padding: 80px 24px 0;
        }

        .process-title {
            font-size: 36px;
        }

        .process-steps {
            gap: 6px;
        }

        .process-arrow {
            padding-top: 70px;
        }

        .process-arrow svg {
            width: 28px;
        }

        .process-compare {
            grid-template-columns: 1fr;
            gap: 20px;
            padding: 28px;
        }

        .compare-divider {
            display: none;
        }
    }

    /* ============================================================
   RESPONSIVE — Mobile (vertical stack)
   ============================================================ */
    @media (max-width: 640px) {
        .hero-section .hero-title {font-size: 36px;margin-bottom: 10px;line-height: 1.15;
            font-weight: 800;}

.hero-subtitle {
    font-size: 16px;
    line-height: normal;
    padding: 0 10px;
    margin-bottom: 15px;
}
.science-section .topic-card {
    padding: 0;
}

.science-section .topic-grid {
    gap: 4px;
}

.science-section .topic-card a.topic-link {
    font-size: 10px;
    padding: 10px 0px;
}

.science-section .topic-head h3 {
    font-size: 12px;
}

.science-section .featured-card {
    /* flex-direction: row; */
    /* display: flex; */
    grid-template-columns: 1fr 1fr;
    gap: 0 10px;
    margin-bottom: 20px;
    padding: 20px;
}

.science-section .featured-card .image > img {
    top: auto;
}

.science-section .featured-card .image {
    height: auto;
}

.science-section .featured-card .featured-body {
    border: 0;
}

.science-section .featured-body h3 {
    font-size: 14px;
    margin: 0;
}

.science-section .featured-body p {
    font-size: 10px;
    line-height: normal;
}

.science-section .weekly-note {
    display: none;
}

.science-section .banner {
    background: #001f3f;
    color: #fff;
    padding: 10px;
    max-width: 100%;
    margin-top: 20px;
    margin: auto;
    margin-top: 10px;
    border-radius: 10px;
    gap: 0;
}

.science-section .banner span.light {
    color: #fff;
    font-size: 13px;
    font-weight: 300;
}
        .process-section {
            padding: 60px 20px 0;
        }

        .process-title {
            font-size: 26px;
            line-height: 1.25;
        }

        .process-subtitle {
            margin-bottom: 40px;
        }

        /* Steps: vertical, image left + text right, down arrows */
        .process-steps {
            flex-direction: column;
            align-items: stretch;
            gap: 0;
            margin-bottom: 50px;
        }

        .process-step {
            flex-direction: row;
            align-items: center;
            max-width: 100%;
            text-align: left;
            gap: 22px;
        }

        .step-image {
            width: 120px;
            height: 120px;
            aspect-ratio: 1 / 1;
            margin-bottom: 0;
            flex-shrink: 0;
            border-radius: 12px;
            background: #ffffff;
            box-shadow: 0 4px 14px rgba(10, 28, 58, 0.08);
            padding: 12px;
        }

        .step-body {
            align-items: flex-start;
            text-align: left;
        }

        .step-number {
            font-size: 20px;
            margin-bottom: 4px;
        }

        .step-title {
            font-size: 16px;
            
        }

        .step-underline {
            margin-bottom: 10px;
        }

        .step-desc {
            font-size: 13px;
        }

        /* Rotate arrow to point down between rows */
        .process-arrow {
            padding-top: 0;
            margin: 6px 0 6px 60px;
            /* aligns roughly under image column */
            transform: rotate(90deg);
            width: 24px;
            color: #02205f;
            opacity: 0.7;
        }

        .process-arrow svg {
            width: 24px;
            height: 10px;
        }

        /* Comparison: two side-by-side cards */
        .process-compare {
            grid-template-columns: 1fr 1fr;
            gap: 14px;
            padding: 22px 16px;
            background-color: #ffffff;
            border-top: 1px solid #e5e0d5;
            border-bottom: none;
        }

        .compare-item {
            flex-direction: column;
            align-items: flex-start;
            gap: 10px;
            background-color: #f7f5f0;
            border-radius: 8px;
            padding: 20px 16px;
        }

        .compare-icon {
            display: none;
        }

        .compare-title {
            font-size: 13px;
            
        }

        .compare-body p {
            font-size: 12.5px;
            line-height: normal;
        }

        .compare-divider {
            display: none;
        }
        
        .process-section .process-title, .follow-section .process-title, .xray-section .title, .improve-section h2, .science-section h2, .eco-section .eco-left h2 {
    font-size: 32px;
}

.science-section .topic-card .topic-head {
    margin: 0;
}

.secure-checkout div {
    flex-direction: row;
    font-weight: 500;
}

.footer-tagline p {
    margin: 0;
}

.footer-top {
    gap: 10px;
    margin-bottom: 0;
}

.footer-links-col ul li {
    margin-bottom: 8px;
}

.footer-links-col h4, .footer-connect-col h4 {
    margin-bottom: 10px;
}

.footer-middle {
    gap: 10px 0px;
}

.features-row {
    width: 100%;
    flex-direction: column;
}

hr.footer-divider-subtle {
    margin: 15px 0;
}

.footer-tagline {
    font-size: 21px;
    /* display: flex; */
    /* flex-direction: row; */
    padding: 13px 0;
}

.footer-brand .footer-logo {
    max-width: 210px;
}

section.main-footer {
    padding: 30px 24px 20px;
}

    .hero-features {
        margin-bottom: 20px;
    }
    }


    /* Animations for Sphere */
    @keyframes floatSphere {
        0% {
            transform: translateY(0px) rotate(0deg);
        }

        50% {
            transform: translateY(-10px) rotate(1deg);
        }

        100% {
            transform: translateY(0px) rotate(0deg);
        }
    }

    @keyframes shadowPulse {
        0% {
            transform: scale(1);
            opacity: 0.8;
        }

        50% {
            transform: scale(0.85);
            opacity: 0.4;
        }

        100% {
            transform: scale(1);
            opacity: 0.8;
        }
    }

    /* Responsive adjustments for Exists section */
    @media (max-width: 1400px) {
        .exists-content-wrapper {
            gap: 15px;
        }

        .exists-info-block {
            flex: 0 0 26%;
        }

        .exists-title {
            font-size: 36px;
        }

        .exists-sphere-img {
            width: 220px;
        }

        .exists-bottom-card .card-text-blue {
            font-size: 20px;
        }
        
          
.inner-page .journey-section .step-title {
  font-size: 12px;
  margin-bottom: 7px;
}
.inner-page .journey-section .step-text {
  font-size: 12px;
  line-height: 1.4;
}
.inner-page .journey-section .quote-callout {
  line-height: 1.3;
}
.inner-page .journey-section .headline {
  font-size: 30px;
  margin-bottom: 10px;
}
.inner-page .journey-section .headline br {
  display: none;
}
.inner-page .journey-section .eyebrow {
  margin-bottom: 9px;
}
.inner-page .journey-section .lede {
  padding-bottom: 15px;
}
.inner-page .journey-section .header-col {
  padding-bottom: 10px;
  padding-left: 24px;
  padding-right: 24px;
}

.inner-page .what-ds-lc-hero {
  margin-bottom: 0;
}


.inner-page .what-ds-lc-hero {
  margin-bottom: 0;
}
.inner-page .what-ds-lc-footer-item {
  justify-content: start;
  flex: 1 1 0px;
}


.inner-page .influences-section .dna-message {
  padding: 22px 26px 22px 26px;
}
.inner-page .what-ds-lc-footer-item {
  justify-content: start;
}
.inner-page .why-section .why-top {
  margin-bottom: 0;
}
.inner-page .why-section .why-text > .eyebrow + h2 {
  font-size: 20px;
}
.inner-page .why-section .why-text p {
  font-size: 15px;
  letter-spacing: 0;
  line-height: 1.2;
}


.inner-page .why-section {
  padding-top: 0;
  padding-bottom: 0;
}
.inner-page .future-section .molecule-graphic {
  display: none;
}
.inner-page .future-section .hero {
  margin-bottom: 0;
}
.inner-page .future-section .section-eyebrow {
  text-align: center;
}
.inner-page .future-section .section-eyebrow::after {
  left: 0;
  right: 0;
  margin: 10px auto 0;
}
.inner-page .philosophy-section .pillars-row {
  padding: 0 20px;
  gap: 20px;
}
    }

    @media (max-width: 1200px) {
        .exists-section {
            padding: 80px 30px;
        }

        .exists-content-wrapper {
            flex-direction: column;
            align-items: center;
            gap: 50px;
        }

        .exists-info-block {
            flex: 1;
            max-width: 650px;
            text-align: center;
            align-items: center;
        }

        .exists-desc-divider {
            justify-content: center;
        }

        .exists-columns-block {
            width: 100%;
            max-width: 450px;
            grid-template-columns: repeat(5, 1fr);
            margin: auto;
        }

        .exists-sphere-block {
            width: 100%;
            max-width: 400px;
            order: -1;
            /* puts sphere between header and content or at top */
            margin-bottom: 20px;
            margin-right: 0;
        }

        .exists-sphere-img {
            width: 280px;
        }
    }

    @media (max-width: 992px) {
        .exists-columns-block {
            grid-template-columns: repeat(3, 1fr);
            gap: 30px 0;
        }

        /* Remove vertical borders for wrapped grid cells */
        .exists-column {
            border-left: none;
            border-bottom: 1px solid rgba(0, 31, 63, 0.05);
            padding: 20px;
        }

        /* We can create a neat grid structure on tablet */
        .exists-columns-block {
            border: 1px solid rgba(0, 31, 63, 0.05);
            border-radius: 8px;
            background-color: rgba(255, 255, 255, 0.4);
        }

        /* border styling for neat grid */
        .exists-column {
            border-left: 1px solid rgba(0, 31, 63, 0.05);
            border-bottom: 1px solid rgba(0, 31, 63, 0.05);
        }

        .exists-column:nth-child(3n+1) {
            border-left: none;
        }

        .exists-column:nth-child(4),
        .exists-column:nth-child(5) {
            border-bottom: none;
        }

        .exists-bottom-card {
            flex-direction: column;
            gap: 15px;
            padding: 25px;
            text-align: center;
        }

        .exists-bottom-card .card-divider {
            width: 60px;
            height: 1px;
        }

        .exists-bottom-card .card-left {
            flex-direction: column;
        }
    }

    .exists-header.desktop {
        display: block;
    }

    .exists-header.mobile {
        display: none;
    }
    
    
    

    @media (max-width: 600px) {
        .exists-section {
            padding: 60px 15px;
        }

        .exists-title {
            font-size: 32px;
            font-weight: 600;
        }

        .exists-desc-text {
            font-size: 15px;
            padding: 0 15px;
        }

        .exists-columns-block {
            background: #001c44 !important;
            /* Deep navy blue matching the image */
            border-radius: 8px;
            padding: 40px 15px !important;
            /* Room for content and arrows */
            position: relative;
            display: block !important;
            width: 100% !important;
            border: none !important;
            max-width: 360px;
        }
        
        .exists-column.swiper-slide {
            gap: 0 !important;
        }
        
        .exists-columns-block-out div.swiper-button-prev {
    left: 0;
    display: flex;
}

.exists-columns-block-out div.swiper-button-prev::after,.exists-columns-block-out div.swiper-button-next::after {
    font-size: 27px;
    color: #fff;
}

.exists-columns-block-out div.swiper-button-next {}

.exists-columns-block-out div.swiper-button-next {
    display: flex;
}

        body .exists-col-icon {
            height: 60px !important;
            width: 60px !important;
            object-fit: contain;
            filter: none !important;
            border-radius: 70px;
        }

        .exists-columns-block .slick-list {
            overflow: hidden;
            width: 100%;
        }

        .exists-columns-block .slick-track {
            display: flex !important;
            align-items: center;
        }

        .exists-columns-block .slick-slide {
            border-left: none !important;
            display: block !important;
        }

        .exists-columns-block .slick-slide .exists-column {
            border-left: none !important;
        }

        .exists-column {
            background: transparent !important;
            border: none !important;
            box-shadow: none !important;
            padding: 0 !important;
            display: flex !important;
            flex-direction: row !important;
            align-items: center !important;
            text-align: left !important;
            gap: 25px !important;
            width: 100% !important;
            transform: none !important;
        }

        .exists-column:hover {
            transform: none !important;
        }

        .exists-col-icon-wrapper {
            flex: 0 0 90px !important;
            height: 90px !important;
            margin-bottom: 0 !important;
            background: transparent !important;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .exists-column {
            gap: 10px !important;
        }

        .exists-col-icon {
            height: 90px !important;
            width: 90px !important;
            object-fit: contain;
            filter: none !important;
        }

        .exists-col-text-wrapper {
            align-items: flex-start !important;
            text-align: left !important;
            gap: 4px;
        }

        .exists-col-title {
            color: #ffffff !important;
            font-size: 22px !important;
            font-weight: 700 !important;
            line-height: 1.2 !important;
            margin-bottom: 0 !important;
            height: auto !important;
            justify-content: flex-start !important;
            text-align: left !important;
        }

        .exists-col-line {
            display: none !important;
            /* Hide gold divider line on mobile */
        }

        .exists-col-subtitle {
            color: #ffffff !important;
            font-size: 15px !important;
            font-weight: 600 !important;
            margin-bottom: 0 !important;
            height: auto !important;
            justify-content: flex-start !important;
            text-align: left !important;
        }

        .exists-col-body {
            color: rgba(255, 255, 255, 0.85) !important;
            font-size: 13px !important;
            line-height: 1.4 !important;
            font-weight: 400 !important;
        }

        /* Slick navigation styling matching the mockup */
        .exists-columns-block .slick-prev,
        .exists-columns-block .slick-next {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background: transparent !important;
            border: none !important;
            color: #ffffff !important;
            font-size: 36px !important;
            line-height: 1 !important;
            padding: 10px !important;
            cursor: pointer;
            z-index: 10;
            transition: opacity var(--transition-speed) ease, transform 0.2s ease;
        }

        .exists-columns-block .slick-prev {
            left: 10px;
        }

        .exists-columns-block .slick-next {
            right: 10px;
        }

        .exists-columns-block .slick-prev:hover,
        .exists-columns-block .slick-next:hover {
            opacity: 0.8;
        }

        .exists-columns-block .slick-prev:active,
        .exists-columns-block .slick-next:active {
            transform: translateY(-50%) scale(0.9);
        }

        .exists-sphere-img {
            width: 220px;
        }

        .exists-bottom-card .card-text-blue {
            font-size: 16px;
        }

        .hero-features {
            display: grid;
            grid-template-columns: 1fr 1fr;
        }

        .hero-features .feature-card {
            flex-direction: row;
            text-align: left;
            gap: 5px;
        }
        
        .hero-right .liposome-bg {
        width: 100%;
        max-width: 140%;
    }

        .exists-header.desktop {
            display: none;
        }

        .exists-header.mobile {
            display: block;
        }

        .exists-sphere-block {
            position: relative;
            max-width: 100%;
            right: auto;
            left: auto;
        }

        .exists-content-wrapper {
            grid-template-columns: 1fr;
            padding-right: 0;
            gap: 20px 0;
        }

        .exists-bottom-card {
            display: none;
        }

        .exists-sphere-img {
            width: 100%;
        }

        section.exists-section {
            padding: 0;
            width: 100%;
        }

        .exists-header {
            padding: 0;
            margin: 0;
        }

        .exists-columns-block-bg {
            background: #001c44 !important;
            border-radius: 8px;
        }

        .exists-columns-block .slick-next {}

        .exists-columns-block .slick-next::before,
        .exists-columns-block .slick-prev:before {
            display: none;
        }

        .exists-columns-block i.fa-solid {
            font-size: 24px;
        }

        .exists-col-subtitle br {
            display: none;
        }

        p.exists-col-body br {
            display: none;
        }

        p.exists-col-body {
            padding-right: 0px;
        }

        .newsletter-form input {
            width: auto;
        }

        h2.process-title {
            display: flex;
            flex-direction: column;
            gap: 0;
            padding: 0 20px;
            font-size: 32px;
        }

        h2.process-title br {
            display: none;
        }


        h2.process-title br {
            display: none;
        }

        .process-section h3.step-title {
            color: var(--accent-gold);
            font-family: 'Playfair Display';
            font-size: 22px;
            letter-spacing: 0;
            line-height: normal;
            margin: 0 0 5px 0;
        }

        .process-section span.step-number {
            color: var(--accent-gold);
            font-family: 'Playfair Display';
            font-size: 24px;
            letter-spacing: 0;
            margin-bottom: 0;
            padding: 0;
            line-height: normal;
        }

        .process-section span.step-underline {
            display: none;
        }

        .process-section p.step-desc {
            font-size: 18px;
            line-height: 21px;
            margin: 0;
            color: #02205f;
        }

        .process-section .step-image {
            border: 1px solid #02205f;
        }

        .process-section .compare-body {
            min-height: 130px;
        }

        .process-section .compare-item {
            background: #fafafa;
            border: 1px solid #eee;
        }

        .process-section .process-compare {
            border: 0;
            background: transparent;
            margin: 0 0 0px 0;
            padding: 0;
        }

        .process-section .process-steps {
            margin-bottom: 40px;
        }

        .compare-body {
            min-height: 130px;
        }

        .compare-item {
            background: #fafafa;
            border: 1px solid #eee;
        }

        .process-compare {
            border: 0;
            background: transparent;
            margin: 0 0 60px 0;
            padding: 0;
        }

        .process-steps {
            margin-bottom: 40px;
        }

        .process-compare .compare-title {
            color: var(--accent-gold);
            font-family: 'Playfair Display';
            font-size: 19px;
            line-height: 20px;
        }

        .process-compare .compare-title::after {
            display: none;
        }

        section.process-section {
            background: #fff;
        }

        section.follow-section {
            padding-top: 40px;
            padding-bottom: 0px;
            background: #001a66;
        }

        section.follow-section h2.process-title .text-blue,
        section.follow-section h2.process-title .text-gold,
        section.follow-section .process-subtitle,
        section.follow-section span.step-number,
        section.follow-section h3.step-title,
        section.follow-section p.step-desc {
            color: #fff;
        }

        section.follow-section .process-subtitle {
            margin-bottom: 25px;
        }

        section.follow-section span.step-number {
            color: #fff;
        }

        section.follow-section h3.step-title {}

        section.follow-section p.step-desc br {
            display: none;
        }

        section.follow-section h2.process-title .text-blue br {
            display: none;
        }

        section.follow-section h2.process-title {
            flex-direction: row;
            justify-content: center;
            gap: 5px;
            padding: 0 0 10px 0;
        }

        section.follow-section h2.process-title span.text-gold {
            font-style: normal;
        }

        section.follow-section .follow-divider {
            display: none;
        }

        section.follow-section .process-arrow {}

        section.follow-section .process-arrow svg {
            /* fill: #fff; */
            stroke: #fff;
        }

        section.follow-section span.step-underline {
            display: none;
        }


        section.follow-section span.step-number {
            color: #fff;
            font-family: "Playfair Display";
            font-size: 22px;
        }

        section.follow-section h3.step-title {
            font-family: "Playfair Display";
            font-size: 22px;
        }

        section.follow-section p.step-desc br {
            display: none;
        }

        section.follow-section .process-arrow {}

        section.follow-section .process-arrow svg {
            /* fill: #fff; */
            stroke: #fff;
        }

        section.follow-section span.step-underline {
            display: none;
        }

        section.follow-section .follow-divider {
            display: none;
        }

        .benefits-bar.exists-bottom-card {
            display: inline-block;
            margin-top: 50px;
            background: transparent;
            border: 0;
            box-shadow: none;
            padding: 0;
            max-width: 100%;
            width: 100%;
        }

        .benefits-bar.exists-bottom-card h3.benefit-title,
        .benefits-bar.exists-bottom-card p.benefit-text {
            color: #fff;
        }

        .benefits-bar.exists-bottom-card h3.benefit-title br {
            display: none;
        }

        .benefits-bar.exists-bottom-card h3.benefit-title {
            font-family: 'Playfair Display';
            margin: 0;
            font-size: 15px;
            letter-spacing: 0;
        }

        .benefits-bar.exists-bottom-card .benefit-icon img {
            max-width: 60px;
            border-radius: 40px;
        }

        .benefits-bar.exists-bottom-card .benefit {
            padding: 10px 0;
            border: 0;
        }

        .benefits-bar.exists-bottom-card p.benefit-text br {
            display: none;
        }

        .process-compare .compare-title br {
            display: none;
        }

        .process-compare p br {
            display: none;
        }

        .process-compare .compare-title {
            font-size: 18px;
        }

        .process-section .compare-item {
            min-height: 190px;
            margin-bottom: 50px;
        }
        
        .inner-page .why-section .path-item p {
    max-width: 110px;
  }
  .inner-page .why-section .path-circle {
    width: 68px;
    height: 68px;
  }
  .inner-page .why-section .path-circle svg {
    width: 26px;
    height: 26px;
  }
  .inner-page .why-section .chevron {
    margin-top: 24px;
  }
  
  .inner-page .future-section .standards-row {
    flex-wrap: wrap;
    gap: 24px;
  }
  .inner-page .future-section .standard-item {
    flex: 1 1 30%;
  }
  .inner-page .future-section .s-divider {
    display: none;
  }
  .inner-page .future-section .journey-columns {
    flex-direction: column;
  }
  .inner-page .future-section .path-box.traditional,
  .inner-page .future-section .path-box.nutra {
    flex: 1 1 100%;
  }
  
  .inner-page .philosophy-section .bg-molecule, .inner-page .philosophy-section .bg-helix {
    display: none;
  }
  .inner-page .philosophy-section .pillar-card p, .inner-page .philosophy-section .pillar-tags {
    font-size: 12px;
  }
  
  .inner-page .philosophy-section .pillars-row {
    flex-wrap: wrap;
  }
  .inner-page .philosophy-section .pillar-card {
    flex: 1 1 45%;
  }
  .inner-page .philosophy-section .pillar-arrow {
    display: none;
  }
    }

    /* Carousel handles 480px via flex-shrink and snap-align */


    /* ============ RESPONSIVE ============ */
    @media (max-width: 1100px) {
        .xray-section .top-grid {
            grid-template-columns: 1fr 1fr;
        }

        .xray-section .bottle-wrap {
            grid-column: 1 / -1;
            order: -1;
            min-height: 480px;
        }

        .xray-section .bottle-wrap img {
            max-height: 480px;
        }

        .xray-section .num-content p {
            max-width: none;
        }
    }
    
     @media (max-width: 1080px){
    .inner-page .problem-section .side-photo{ display:none; }
    .inner-page .problem-section .columns{ grid-template-columns: 1fr; gap: 24px;margin-bottom: 25px; }
    .inner-page .problem-section .headline{ font-size: 34px; }
    
    .inner-page .journey-section .top-grid{ grid-template-columns: 1fr; }
    .inner-page .journey-section .portrait-frame{ height: 380px; max-width: 340px; margin: 0 auto; }
    .inner-page .journey-section .molecule-deco, .cluster-deco{ display:none; }
    .inner-page .journey-section .steps-row{ grid-template-columns: repeat(2, 1fr); row-gap: 34px; }
    .inner-page .journey-section .step:nth-child(3){ border-left: none; }
    .inner-page .journey-section .step:nth-child(odd){ border-left: none; }
    
    .inner-page .influences-section .corner-deco{ display:none; }
    .inner-page .influences-section .cards{ grid-template-columns: 1fr; }
    .inner-page .influences-section .card:not(:first-child){ border-top: 1px solid var(--line); }
    .inner-page .influences-section .headline{ font-size: 32px; }

    .inner-page .influences-section .dna-banner{ grid-template-columns: 1fr; }
    .inner-page .influences-section .dna-visual{ min-height: 110px; }
    .inner-page .influences-section .dna-side{ border-left:none; border-top: 1px solid var(--line); flex-direction: column; text-align:center; }
    .inner-page .influences-section .dna-message{ flex-direction: column; text-align:center; }
    
    .inner-page .what-ds-lc-decor {
    width: 170px;
  }
  .inner-page .what-ds-lc-footer-divider {
    display: none;
  }
    .inner-page .what-ds-lc-decor {
    display: none;
  }
  .inner-page .what-ds-lc-block {
    flex: 1 1 100%;
    justify-content: center;
  }
  .inner-page .what-ds-lc-plus {
    display: none;
  }
  .inner-page .what-ds-lc-blocks {
    gap: 32px;
  }
  
  
  .inner-page .lipid-section .lipid-top {
    flex-direction: column-reverse;
    gap: 30px;
  }
  .inner-page .lipid-section .lipid-text, .lipid-graphic {
    flex: 1 1 100%;
    width: 100%;
  }
  .inner-page .lipid-section .lipid-graphic {
    height: 220px;
  }
  .inner-page .lipid-section .philosophy-box {
    flex-direction: column;
    align-items: stretch;
  }
  .inner-page .lipid-section .divider {
    display: none;
  }
  .inner-page .lipid-section .dark-box {
    flex-direction: column;
    align-items: flex-start;
  }
  .inner-page .lipid-section .dark-right {
    gap: 24px;
  }
  
  .inner-page .nutra-tech-section .bg-helix, .inner-page .nutra-tech-section .bg-molecule {
    display: none;
  }
  .inner-page .nutra-tech-section .tech-desc, .inner-page .nutra-tech-section .tech-tag {
    font-size: 11.5px;
  }
  .inner-page .nutra-tech-section .tech-row {
    flex-wrap: wrap;
    gap: 16px;
  }
  .inner-page .nutra-tech-section .tech-card {
    flex: 1 1 45%;
  }
  .inner-page .nutra-tech-section .connector {
    display: none;
  }
  .inner-page .nutra-tech-section .banner-helix, .banner-molecule {
    display: none;
  }
  
  .inner-page .vision-supplementation-section .bg-molecule, .inner-page .vision-supplementation-section .bg-helix {
    display: none;
  }
  .inner-page .vision-supplementation-section .columns-row {
    flex-direction: column;
    gap: 30px;
  }
  .inner-page .vision-supplementation-section .col-divider {
    display: none;
  }
  .inner-page .vision-supplementation-section .commitment-row {
    flex-wrap: wrap;
    gap: 26px;
  }
  .inner-page .vision-supplementation-section .commitment-item {
    flex: 1 1 45%;
  }
  .inner-page .vision-supplementation-section .commitment-row .col-divider {
    display: none;
  }

  }
  
    @media (max-width: 720px) {
        .xray-section {
            padding: 50px 18px 30px;
        }

        .xray-section .top-grid {
            grid-template-columns: 1fr;
            gap: 26px;
        }

        .xray-section .bottle-wrap {
            min-height: 360px;
        }

        .xray-section .bottle-wrap img {
            max-height: 360px;
        }

        .xray-section .eyebrow {
            justify-content: center;
        }

        .xray-section .left-col {
            text-align: center;
        }

        .xray-section .lede {
            margin-left: auto;
            margin-right: auto;
        }

        .xray-section .thin-divider {
            justify-content: center;
        }

        .xray-section .thin-divider .r {
            display: none;
        }

        .xray-section .thin-divider .l {
            flex: 0 0 60px;
        }

        .xray-section .pillars {
            grid-template-columns: repeat(2, 1fr);
            gap: 24px 10px;
        }

        .xray-section .science {
            margin: 0 auto;
            flex-direction: column;
            text-align: center;
        }

        .xray-section .guarantees {
            grid-template-columns: 1fr 1fr;
            gap: 20px;
        }

        .xray-section .num-content p {
            font-size: 12.5px;
        }

        .xray-section .top-grid {
            grid-template-columns: 1fr;
        }

        .xray-section .pillars {
            display: none;
        }

        .xray-section .bottle-wrap {
            position: relative;
            order: 2;
        }

        .xray-section .left-col {
            order: 1;
        }

        .xray-section .numbered-list {
            order: 3;
        }

        .xray-section .guarantees {
            margin-top: 0px;
            border: 0;
            padding: 0;
            gpa: 0;
        }

        .xray-section .g-content h4 {
            letter-spacing: 0;
            line-height: normal;
            margin: 0;
        }

        .xray-section .g-item {
            width: 100%;
        }

        .xray-section .g-content {
            width: 100%;
        }

        .xray-section .g-content h4 br {
            display: none;
        }

        .xray-section .flow-right {
            display: flex;
            /* flex-direction: column; */
            align-items: start;
            order: 2;
            margin-top: 0px;
        }

        .flow-right .bottle-wrap {
            margin: 0;
            width: 37%;
        }

        .xray-section .num-badge {
            display: none;
        }

        .xray-section .numbered-list {
            padding: 0;
            border: 0;
            gap: 6px 0;
        }

        .xray-section .num-item {
            padding: 0;
            border: 0;
            background: transparent;
            gap: 6px;
        }

        .xray-section .bottle-wrap img {
            max-width: 158px;
        }

        .xray-section .num-content h3 {
            letter-spacing: 0;
            margin: 0;
            line-height: normal;
            font-size: 10px;
            font-weight: 600;
            padding-bottom: 2px;
        }

        .xray-section .num-content p {
            letter-spacing: 0;
            line-height: 15px;
        }
        
        .xray-section .num-icon {
            height: auto;
            width: auto;
        }

        .xray-section .num-icon img {
            max-width: 33px;
            width: auto;
        }

        .xray-section .num-icon {
            height: auto;
            width: auto;
        }

        .xray-section .left-col {}

        .xray-section .thin-divider {
            display: none;
        }

        .xray-section .left-col p.lede {
            margin-bottom: 16px;
            line-height: normal;
        }
        
        
    }
    

    /* ================= MOBILE ================= */
    @media (max-width:768px) {
        .improve-section .section {
            padding: 36px 16px 28px;
        }

        .improve-section h2 {
            font-size: 26px;
        }

        .improve-section .subhead {
            font-size: 13px;
            margin-bottom: 24px;
        }

        .improve-section .eyebrow {
            font-size: 10.5px;
        }

        .improve-section .categories {
            grid-template-columns: repeat(4, 1fr);
            gap: 10px;
            margin-bottom: 20px;
        }

        .improve-section .cat-btn {
            padding: 14px 4px 10px;
            border-radius: 8px;
        }

        .improve-section .cat-btn svg {
            width: 20px;
            height: 20px;
        }

        .improve-section .cat-btn span {
            font-size: 9px;
        }

        .improve-section .cat-panel {
            grid-template-columns: 1fr;
            padding: 20px;
            border-radius: 12px;
            row-gap: 16px;
        }

        .improve-section .content-left {
            grid-column: 1;
            grid-row: 1;
        }

        .improve-section .content-left h2 {
            font-size: 20px;
        }

        .improve-section .content-left p {
            font-size: 13px;
            margin: 10px 0 16px;
        }

        .improve-section .btn-primary {
            width: 100%;
            justify-content: center;
            padding: 14px;
        }

        .improve-section .products-row {
            grid-column: 1;
            grid-row: 2;
            gap: 8px;
            min-width: 320px;
        }

        .improve-section .rail-arrow {
            width: 30px;
            height: 30px;
        }

        /* single-card view: one product fills the viewport, gap removed */
        .improve-section .products-track {
            gap: 0;
            
        }

        .improve-section .product-card {
            flex: 0 0 100%;
            background: linear-gradient(135deg, #eef2fb, #e5ecfb);
            border-radius: 12px;
            padding: 18px;
        }

        .improve-section .product-thumb {
            background: transparent;
            height: auto;
            margin-bottom: 6px;
        }

        .improve-section .product-thumb .bottle {
            width: 64px;
            height: 118px;
            font-size: 6.5px;
        }

        .improve-section .product-card h3 {
            font-size: 15px;
        }

        .improve-section .product-card p {
            font-size: 12px;
            min-height: auto;
        }

        .improve-section .dots {
            display: flex;
            grid-column: 1;
            grid-row: 3;
            margin-top: 0;
        }

        .improve-section .features {
            grid-template-columns: 1fr;
            border-radius: 12px;
            padding: 6px 18px;
        }

        .improve-section .feature {
            flex-direction: row;
            text-align: left;
            justify-content: flex-start;
            border-right: none;
            border-bottom: 1px solid var(--border);
            padding: 16px 0;
            gap: 14px;
        }

        .improve-section .feature:last-child {
            border-bottom: none;
        }

        .improve-section .feature .icon-ring {
            width: 38px;
            height: 38px;
            flex-shrink: 0;
        }

        .improve-section .feature .text {
            flex: 1;
        }

        .improve-section .feature h4 {
            margin-bottom: 3px;
        }

        .improve-section .feature-arrow {
            display: block;
            flex-shrink: 0;
            width: 16px;
            height: 16px;
            stroke: #001f3f;
        }
        
        .exists-info-block {
             padding-right: 0px; 
        }
        
        section#shopify-section-template--17112933236943__featured_collection_PtGeMR .collection {
        padding-top: 35px;
        padding-bottom: 0;
    }
    
    .collection__description.subtitle p {
    margin: 0 auto 15px;
}

.inner-page.about-page .hero-inner{
      grid-template-columns: 1fr;
      padding: 0px 24px 0;
      gap: 8px;
    }
    .inner-page.about-page .visual{ order: -1; min-height: auto; margin-bottom: 20px; }
    .inner-page.about-page .badges{ display:none; }
    .inner-page.about-page .portrait-wrap{
      width: 100%;
      max-width: 420px;
      height: 460px;
      margin: 0 auto;
      border-radius: 50%;
    }
    .inner-page.about-page .molecule-deco{ width: 200px; left: -20px; top: 0; }
    .inner-page.about-page .cluster-deco{ width: 170px; right: -20px; left: auto; bottom: 20px; }
 
    .inner-page.about-page .brand{ display:none; }
    .inner-page.about-page .headline{
      font-size: 32px;
      text-align: center;
    }
    .inner-page.about-page .eyebrow{ text-align:center; font-size: 11px; }
    .inner-page.about-page .intro, .inner-page.about-page .body-text, .inner-page.about-page .callout, .inner-page.about-page .compare-box{
      text-align: center;
      margin-left: auto;
      margin-right: auto;
    }
    .inner-page.about-page .compare-box{ flex-direction: column; gap: 14px; padding: 18px; }
    .inner-page.about-page .divider-v{ width: 60%; height: 1px; }
    .inner-page.about-page .compare-item{ justify-content: center; text-align:left; }
 
    .inner-page.about-page .features{
      flex-direction: column;
      align-items: center;
      gap: 14px;
    }
    .inner-page.about-page .feature-sep{ display:none; }
 
    .inner-page.about-page .cta{
      display:flex;
      justify-content: center;
      width: 100%;
      max-width: 420px;
      margin: 0 auto;
    }
 
    .inner-page.about-page .mobile-credentials{
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 16px;
      max-width: 460px;
      margin: 36px auto 0;
      padding-bottom: 40px;
    }
    .inner-page.about-page .mc-item{
      display:flex;
      flex-direction: column;
      align-items:center;
      gap: 10px;
      text-align:center;
    }
    .inner-page.about-page .mc-icon{
      width: 68px; height: 68px;
      border: 1px solid var(--line);
      border-radius: 6px;
      display:flex; align-items:center; justify-content:center;
      background: var(--white);
    }
    .inner-page.about-page .mc-icon img, .inner-page.about-page .mc-icon svg{ width: 32px; height: 32px; }
    .inner-page.about-page .mc-label{
      
      font-size: 11px;
      font-weight: 700;
      color: var(--text-dark);
      line-height: 1.3; 
    }
 
    .inner-page.about-page .strip{
      flex-wrap: wrap;
      gap: 10px 16px; 
      text-align:center;
      font-size: 10px;
      letter-spacing: 1px;
      padding: 20px 16px;
    }
    
    .inner-page .problem-section .problem{ padding: 48px 18px 0; }
    .inner-page .problem-section .headline{ font-size: 26px; }
    .inner-page .problem-section .hex-divider .rule{ width: 70px; }
    .inner-page .problem-section .quote-box p{ font-size: 16px; padding: 12px 18px; text-align:center; }
    .inner-page .problem-section .lede{ font-size: 14px; }
    .inner-page .problem-section .panel-body{ padding: 22px 18px 26px; }
    .inner-page .problem-section .strip{
      flex-direction: column;
      gap: 24px;
      padding: 30px 20px 40px;
    }
    .inner-page .problem-section .strip-line{ display:none; }
    .inner-page .problem-section .strip-item{ justify-content:center; }
     
    .inner-page .problem-section .headline{ font-size: 22px; }
    .inner-page .problem-section .step-label{ font-size: 14px; }
    
    .inner-page .journey-section .journey{ padding: 40px 18px 0; }
    .inner-page .journey-section .headline{ font-size: 26px; }
    .inner-page .journey-section .steps-row{ grid-template-columns: 1fr; }
    .inner-page .journey-section .step{ border-left: none !important; padding: 0; border-top: 1px solid #ddd5be; padding-top: 22px; margin-top: 22px; }
    .inner-page .journey-section .step:first-child{ border-top: none; margin-top: 0; padding-top:0; }
    .inner-page .journey-section .bottom-strip-icons{ gap: 24px; }
    .inner-page .journey-section .bottom-headline{ font-size: 19px; }
    
    .inner-page .influences-section .influences{ padding: 40px 16px 0; }
    .inner-page .influences-section .headline{ font-size: 24px; }
    .inner-page .influences-section .lede{ font-size: 13.5px; margin-bottom: 28px; }
    .inner-page .influences-section .card{ padding: 24px 20px 26px; }
    .inner-page .influences-section .card-head{ flex-direction: column; text-align:center; }
    .inner-page .influences-section .card-hex-divider, .card-affiliation, .card-role, .card-fields{ text-align:center; }
    .inner-page .influences-section .card-hex-divider{ justify-content:center; }
    .inner-page .influences-section .footer-list{ flex-direction: column; gap: 8px; }
    .inner-page .influences-section .footer-list .dot{ display:none; }
    
    .inner-page .what-ds-lc-section {
    padding: 40px 16px 36px;
  }
  .inner-page .what-ds-lc-title {
    letter-spacing: 1px;
  }
  .inner-page .what-ds-lc-block {
    flex-direction: column;
    text-align: center;
    gap: 14px;
  }
  .inner-page .what-ds-lc-block-body {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .inner-page .what-ds-lc-block-underline {
    margin: 0 auto 14px;
  }
  .inner-page .what-ds-lc-quote-box {
    padding: 24px 20px;
    flex-direction: column;
  }
  .inner-page .what-ds-lc-quote-mark {
    display: none;
  }
  .inner-page .what-ds-lc-footer {
    flex-direction: column;
    align-items: stretch;
  }
  .inner-page .what-ds-lc-footer-item {
    justify-content: center;
    text-align: left;
  }
  

  .inner-page .lipid-section {
    padding: 40px 16px 60px;
  }
  .inner-page .lipid-section .lipid-text p {
    max-width: 100%;
  }
  .inner-page .lipid-section .philosophy-left {
    flex-direction: column;
    text-align: center;
    gap: 14px;
  }
  .inner-page .lipid-section .feature {
    flex: 1 1 100%;
  }
  .inner-page .lipid-section .dark-left {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .inner-page .lipid-section .dark-right {
    width: 100%;
    justify-content: space-between;
  }
  .inner-page .lipid-section .dark-item span {
    max-width: 70px;
  }
  .inner-page .why-section .why-top {
    flex-direction: column;
    gap: 30px;
  }
  .inner-page .why-section .why-text, .why-graphic {
    flex: 1 1 100%;
    width: 100%;
  }
  .inner-page .why-section .why-graphic {
    height: 220px;
  }
  .inner-page .why-section .path-row {
    flex-direction: column;
    align-items: center;
    gap: 22px;
  }
  .inner-page .why-section .chevron {
    transform: rotate(90deg);
    margin-top: 0;
  }
  .inner-page .why-section .path-item p {
    max-width: 260px;
  }
  
  .inner-page .why-section .inner-page .why-section {
    padding: 40px 16px 60px;
  }
  .inner-page .why-section .why-text p {
    max-width: 100%;
  }
  .inner-page .why-section .path-box {
    padding: 22px 18px;
  }
  .inner-page .why-section .quote-box {
    flex-direction: column;
    text-align: center;
  }
  
  .inner-page .future-section .capsule-graphic {
    display: none;
  }
  .inner-page .future-section .journey-header {
    flex-direction: column;
    align-items: flex-start;
  }
  .inner-page .future-section .journey-header .molecule-graphic.small {
    display: none;
  }
  .inner-page .future-section .path-row {
    flex-direction: column;
    align-items: center;
    gap: 18px;
  }
  .inner-page .future-section .chevron {
    transform: rotate(90deg);
    margin-top: 0;
  }
  .inner-page .future-section .path-item p {
    max-width: 220px;
  }
  
  .inner-page .future-section .standard-item {
    flex: 1 1 100%;
  }
  .inner-page .future-section {
    padding: 40px 16px 50px;
  }
  .inner-page .future-section .journey-card {
    padding: 26px 18px;
  }
  .inner-page .future-section .quote-box {
    flex-direction: column;
    text-align: center;
  }
  
  
  .inner-page .philosophy-section .inner-page .philosophy-section {
    padding: 30px 16px 0;
  }
  .inner-page .philosophy-section .pillar-card {
    flex: 1 1 100%;
  }
  .inner-page .philosophy-section .banner-card {
    flex-direction: column;
    text-align: center;
    padding: 30px 22px;
  }
  .inner-page .philosophy-section .banner-bubbles {
    display: none;
  }
  .inner-page .philosophy-section .pillars-list {
    font-size: 15px;
    line-height: 2;
  }
  .inner-page .philosophy-section .footer-sub {
    flex-direction: column;
    gap: 8px;
  }
  .inner-page .philosophy-section .footer-line {
    display: none;
  }
  
  .inner-page .nutra-tech-section  {
    padding: 30px 16px 40px;
  }
  .inner-page .nutra-tech-section .tech-card {
    flex: 1 1 100%;
  }
  .inner-page .nutra-tech-section .objective-line {
    flex-direction: column;
    gap: 12px;
  }
  .inner-page .nutra-tech-section .objective-line .hexagon {
    display: none;
  }
  .inner-page .nutra-tech-section .v-line {
    display: none;
  }
  .inner-page .nutra-tech-section .banner-card {
    flex-direction: column;
    text-align: center;
    padding: 30px 22px;
  }
  
   .inner-page .vision-supplementation-section .header {
    padding: 34px 16px 26px;
  }
  .inner-page .vision-supplementation-section .commitment-item {
    flex: 1 1 100%;
  }
  .inner-page .vision-supplementation-section .footer-tags {
    flex-direction: column;
    gap: 10px;
  }
  .inner-page .vision-supplementation-section .f-divider {
    display: none;
  }
  .inner-page .vision-supplementation-section .wave-decor {
    display: none;
  }
  
  
  
.inner-page.about-page .hero-inner {
  flex-direction: column-reverse;
}
.inner-page.about-page .hero-inner .hero-right {
  order: 1;
}
.inner-page.about-page .hero-inner .content {
  order: 2;
}
.inner-page.about-page .hero-section .headline {
  font-size: 20px;
  padding-top: 16px;
}
.inner-page.about-page .divider-v {
  width: 100%;
}
.inner-page.about-page .divider-v span {
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -10px;
}
.inner-page.about-page .compare-item.yes-text {
  width: 100%;
  margin-top: 10px;
}
.inner-page.about-page .compare-box {
  border: 0;
  padding: 0;
  background: transparent;
}
.inner-page.about-page .compare-item {
  margin-bottom: 10px;
}
.inner-page .problem-section .panel {
  width: 85%;
  margin: auto;
}
.inner-page .problem-section .quote-box p {
  font-size: 14px;
  letter-spacing: 0;
  width: 100%;
}
.inner-page .problem-section .lede {
  margin-bottom: 13px;
}
.inner-page .problem-section .headline {
  margin-bottom: 10px;
}
.inner-page .problem-section {
  padding-top: 30px;
}
.inner-page .problem-section .explain-text {
  letter-spacing: 0;
  line-height: 1.2;
  font-size: 15px;
}
.inner-page .problem-section .explain-text strong {
  letter-spacing: 0;
  font-size: 14px;
  line-height: 1.2;
}
.inner-page .problem-section .explain-icon .liposome-bg {
  width: 100%;
}
.inner-page .problem-section .explain-text strong {
  margin-bottom: 0;
}
.inner-page .problem-section .strip-hex .liposomebg {
  max-width: 45px;
}
.inner-page .problem-section .strip-text span.b1,.inner-page .problem-section .strip-text span.b2 {
  font-size: 13px;
  letter-spacing: 0;
}
.inner-page .problem-section .strip-hex {
  width: auto;
  height: auto;
}
.inner-page .problem-section .strip > .strip-line {
  display: none;
}
.inner-page .problem-section .strip {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  text-align: left;
  gap: 0;
  padding: 14px 0;
}
.inner-page .problem-section .strip-item {
  gap: 0;
}
.inner-page .journey-section .top-grid {
  flex-direction: column;
  gap: 0;
}
.inner-page .journey-section .portrait-col {
  position: relative;
      width: 100%;
      margin: 0 auto;
      height: auto;
      overflow: hidden;
      background: #f4f3f1;
      text-align: center;
      justify-content: center;
}
.inner-page .journey-section .portrait-col .image {
      height: 40%;
      text-align: center;
      background: #f3f2f1;
      width: 50%;
      margin: auto;
    }
body .inner-page .journey-section .portrait-col .liposome-bg {
  height: 20%;
      object-fit: fill;
      max-width: 100%;
      object-fit: fill;
}
.inner-page .journey-section .portrait-col .image {
  height: 40%;
      text-align: center;
      background: #f3f2f1;
}
.inner-page .journey-section .header-col {
  width: 100%;
  padding-top: 30px;
}


.inner-page .influences-section .influences-inner {
  padding: 0 24px;
}

.inner-page .lipid-section,.inner-page .why-section {
    background: transparent;
}
.image.section-right-img {
    display: none
}
    }
    
    
    
    
a:empty, ul:empty, dl:empty, div:empty, section:empty, article:empty, p:empty, h1:empty, h2:empty, h3:empty, h4:empty, h5:empty, h6:empty {
    display: block;
}