@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

 :root {
     --gold: #c58a1b;
     --gold-dark: #9a6a11;
     --text: #1f2730;
     --muted: #5d6470;
     --bg: #f4ead7;
     --sfoot-text: #f9f9f9;
     --sfoot-heading: #fff8ef;
     --line: rgba(31, 39, 48, .13);
     --white: #ffffff;
 }


 a {
     text-decoration: none;
     color: inherit;
 }


 html {
     scroll-behavior: smooth
 }

 body {
     font-family: "Poppins", sans-serif;
     background: #f7f1e8;
     color: var(--text)
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
     font-family: "Cormorant Garamond", serif;
     color: var(--text)
 }

 .sth-site-header {
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     z-index: 1030;
     transition: all .35s ease;
     background: transparent
 }

 .sth-site-header.sth-fixed {
     background: #fff;
     box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
     animation: dropIn .35s ease both
 }

 @keyframes dropIn {
     from {
         transform: translateY(-16px);
         opacity: .2
     }

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

 .sth-navbar {
     padding: 10px 0
 }

 .sth-brand-mark {
     width: 44px;
     height: 44px;
     border: 2px solid var(--gold);
     border-radius: 14px;
     display: grid;
     place-items: center;
     color: var(--gold);
     font-weight: 700;
     background: rgba(255, 255, 255, .5)
 }

 .sth-site-header .nav-link {
     color: #000000e8;
     font-weight: 500;
     padding: .9rem 1rem;
     font-size: 1rem;

 }

 .sth-site-header .nav-link:hover,
 .sth-site-header .nav-link:focus,
 .sth-site-header .nav-link:focus-visible {
     box-shadow: none !important;

 }

 .sth-btn-book {
     background: var(--gold);
     color: #fff;
     border: none;
     border-radius: 12px;
     padding: .85rem 1.2rem;
     font-weight: 600;
     box-shadow: 0 10px 25px rgba(197, 138, 27, .22)
 }

 .sth-btn-book:hover {
     background: var(--gold-dark);
     color: #fff
 }

 .sth-dropdown-menu {
     border: 0;
     padding: 0;
     background: #9a6a11b5;
     box-shadow: 0 24px 50px rgba(40, 28, 10, .12);
     min-width: 320px;
     width: max-content;
     margin-top: 0 !important;
 }

 .sth-dropdown-item {
     padding: 8px 12px;
     white-space: normal;
     font-weight: 400;
     font-size: 0.9rem;
     border-bottom: 1px solid rgba(255, 255, 255, .22);
     color: #fff;
     margin: 0;
     position: relative;
     outline: none;
 }

 .sth-dropdown-item:hover,
 .sth-dropdown-item:focus {
     background: #fbf5ea;

     color: var(--gold-dark)
 }

 .sth-dropdown-item::after {
     position: absolute;
     right: 16px;
     top: 50%;
     transform: translateY(-50%);
 }


 @media (min-width: 992px) {
     .sth-dropdown-menu .dropdown-menu {
         display: none;
     }

     .sth-dropdown-menu .dropend {
         position: relative;
     }

     .sth-dropdown-menu .dropend>.dropdown-menu {
         position: absolute;
         top: 0;
         left: 100%;
         margin-left: 0;
         width: max-content;
         min-width: 260px;
         z-index: 2050;
         padding: 0;
         border: none;
         box-shadow: 0 18px 40px rgba(0, 0, 0, .08);
         background: #9a6a11b5;
     }

     .navbar .dropdown:hover>.dropdown-menu,
     .navbar .dropend:hover>.dropdown-menu {
         display: block;
     }

     .sth-dropdown-menu .dropdown.show>.dropdown-menu,
     .sth-dropdown-menu .dropend.show>.dropdown-menu {
         display: block;
     }
 }

 @media (max-width: 991.98px) {
     .sth-site-header {
         /* position: relative; */
         background: #a48160;
         box-shadow: 0 10px 30px rgba(0, 0, 0, .08)
     }

     .sth-banner {
         padding-top: 110px
     }

     .navbar-toggler {
         border: 2px solid rgba(255, 255, 255, .7);
     }

     .sth-site-header .navbar-collapse {
         margin-top: .9rem;
         background: rgba(255, 255, 255, .98);
         border-radius: 22px;
         padding: 1rem;
         box-shadow: 0 18px 40px rgba(0, 0, 0, .12);
         overflow: auto;
         max-height: 90vh;
     }

     .sth-site-header .navbar-nav {
         gap: .35rem;
         padding: .35rem 0
     }

     .sth-site-header .nav-item {
         width: 100%
     }

     .sth-site-header .nav-link {
         padding: .95rem 1rem;
         border-radius: 14px;
         display: flex;
         align-items: center;
         justify-content: space-between;
         background: #faf6ef;
         margin-bottom: .35rem
     }

     .sth-site-header .nav-link.dropdown-toggle::after {
         margin-left: auto
     }

     .sth-site-header .dropdown-menu {
         position: static !important;
         transform: none !important;
         float: none;
         width: 100%;
         min-width: 100%;
         margin: 0;
         padding: 0;
         /* border-radius: 16px; */
         box-shadow: none;
         background: var(--gold-dark);
         border: 1px solid rgba(197, 138, 27, .12)
     }

     .sth-site-header .dropdown-menu .dropdown-menu {
         position: static !important;
         transform: none !important;
         float: none;
         width: 100%;
         min-width: 100%;
         margin-left: 0;
         padding: 0;
         /* border-radius: 16px; */
         box-shadow: none;
         background: #faf6ef;
         border: 1px solid rgba(197, 138, 27, .12)
     }

     .sth-site-header .dropdown-menu .dropdown-menu .dropdown-item {
         color: var(--text);
     }

     .sth-site-header .dropdown-item {
         padding: .82rem .95rem;
     }

     .sth-btn-book {
         width: 100%;
         justify-content: center;
         margin-top: .4rem
     }
 }


 .sth-reveal {
     opacity: 0;
     transform: translateY(24px) scale(.985);
     transition: opacity .7s ease, transform .7s ease
 }

 .sth-visible {
     opacity: 1;
     transform: translateY(0) scale(1)
 }

 .sth-banner-reveal {
     overflow: hidden;
 }



 /* why choose */


 .shw-wrap {
     padding: 60px 0;
     background: #fff;
 }

 .shw-title {
     font-size: clamp(2.8rem, 3.8vw, 4rem);
     line-height: .95;
     margin: 0 0 18px;
     color: #202229
 }

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

 .shw-divider {
     display: flex;
     align-items: center;
     gap: 10px;
     margin: 15px 0 15px
 }

 .shw-divider:before,
 .shw-divider:after {
     content: '';
     height: 2px;
     width: 74px;
     background: var(--gold);
     opacity: .9;
     border-radius: 999px
 }

 .shw-divider i {
     color: var(--gold);
     font-size: 1rem
 }

 .shw-desc {
     font-size: 0.9rem;
     line-height: 1.85;
     color: #4d5560;
     max-width: 560px;
     margin: 0 0 15px
 }

 .shw-img {
     margin-top: 18px;
     border-radius: 26px;
     overflow: hidden;
     box-shadow: 0 18px 45px rgba(0, 0, 0, .08);
     background: #fff
 }

 .shw-img img {
     display: block;
     width: 100%;
     height: 100%;
     object-fit: cover
 }

 .shw-cards {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 10px
 }

 .shw-card {
     border-radius: 20px;
     padding: 20px 12px 20px;
     min-height: 262px;
     box-shadow: 0 10px 25px rgba(0, 0, 0, .15);
     transition: transform .25s ease, box-shadow .25s ease
 }

 .shw-card:hover {
     transform: translateY(-3px);
     box-shadow: 0 16px 35px rgba(0, 0, 0, .08)
 }

 .shw-card.shw-gold {
     background: var(--gold);
     color: #fff
 }

 .shw-card.shw-light {
     background: #fff;
     color: #222
 }

 .shw-icon {
     font-size: 2rem;
     line-height: 1;
     width: 55px;
     height: 55px;
     border-radius: 15px;
     flex-shrink: 0;
     display: flex;
     align-items: center;
     justify-content: center;
     opacity: .95;
     /* text-align: center; */
     margin-bottom: 15px
 }

 .shw-card.shw-gold .shw-icon {
     color: var(--gold-dark);
     background: #fff;
 }

 .shw-card.shw-light .shw-icon {
     color: #fff;
     background: var(--gold);
 }


 .shw-card h3 {
     font-size: 1.75rem;
     line-height: 1.1;
     /* text-align: center; */
     margin: 0 0 16px;
     color: inherit
 }

 .shw-card p {
     margin: 0;
     font-size: 0.9rem;
     line-height: 1.65;
     text-align: left;
     color: inherit;
 }

 .shw-light p {
     color: #505865;
     opacity: 1
 }

 @media (max-width: 1199.98px) {
     .shw-grid {
         grid-template-columns: 1fr;
         gap: 28px
     }

     .shw-left {
         padding-right: 0
     }
 }

 @media (max-width: 991.98px) {
     .shw-cards {
         grid-template-columns: repeat(2, 1fr)
     }
 }

 @media (max-width: 575.98px) {
     .shw-wrap {
         padding: 38px 0
     }

     .shw-cards {
         grid-template-columns: 1fr
     }

     .shw-title {
         font-size: 2.4rem
     }

     .shw-desc {
         font-size: .98rem;
         line-height: 1.7
     }

     .shw-card {
         min-height: auto
     }
 }



 /* profile section  */

 .dp-wrap {
     padding: 72px 0
 }

 .dp-shell {
     background: linear-gradient(135deg, #fffdf8 0%, #f8f1e5 34%, #efe1c8 100%);
     border-radius: 34px;
     overflow: hidden;
     box-shadow: 0 24px 70px rgba(40, 28, 8, .08);
     position: relative
 }

 .dp-shell:before {
     content: '';
     position: absolute;
     inset: 0;
     background: radial-gradient(circle at 10% 20%, rgba(197, 138, 27, .16), transparent 20%), radial-gradient(circle at 90% 10%, rgba(154, 106, 17, .16), transparent 18%), radial-gradient(circle at 70% 90%, rgba(197, 138, 27, .1), transparent 22%);
     pointer-events: none
 }

 .dp-left {
     padding: 30px 20px 30px;
     position: relative;
     z-index: 1
 }

 .dp-name {
     font-size: clamp(2rem, 4vw, 4rem);
     line-height: .94;
     margin: 0 0 10px;
 }

 .dp-role {
     font-size: 1rem;
     color: var(--gold-dark);
     font-weight: 600;
     letter-spacing: .08em;
     text-transform: uppercase;
     margin-bottom: 12px
 }

 .dp-meta {
     display: flex;
     flex-wrap: wrap;
     gap: 7px;
     margin-bottom: 15px
 }

 .dp-chip {
     display: inline-flex;
     align-items: center;
     gap: 5px;
     padding: 7px 10px;
     border-radius: 999px;
     background: rgba(255, 255, 255, .7);
     border: 1px solid rgba(197, 138, 27, .16);
     color: #795722;
     font-size: .8rem;
     font-weight: 500
 }

 .dp-chip i {
     color: var(--gold)
 }

 .dp-summary {
     font-size: 0.95rem;
     line-height: 1.75;
     color: var(--text);
     margin: 0 0 12px;
 }

 .dp-actions {
     display: flex;
     flex-wrap: wrap;
     gap: 12px;
     margin-top: 20px
 }

 .dp-btn {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     padding: 10px 18px;
     border-radius: 14px;
     text-decoration: none;
     font-weight: 400;
     transition: .25s ease
 }

 .dp-btn-primary {
     background: var(--gold);
     color: #fff;
     box-shadow: 0 14px 28px rgba(197, 138, 27, .24)
 }

 .dp-btn-primary:hover {
     background: var(--gold-dark);
     color: #fff
 }

 .dp-btn-ghost {
     background: rgba(255, 255, 255, .55);
     color: var(--text);
     border: 1px solid rgba(154, 106, 17, .14)
 }

 .dp-btn-ghost:hover {
     background: #fff;
     color: var(--gold-dark)
 }

 .dp-right {
     position: relative;
     min-height: 100%;
     padding: 0
 }

 .dp-photo-card {
     position: relative;
     height: auto;
     min-height: 620px;
     overflow: hidden;

 }

 .dp-photo-card img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     display: block;
     filter: saturate(1.03)
 }

 .dp-photo-card:after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(180deg, rgba(255, 255, 255, 0) 45%, rgba(0, 0, 0, .18) 100%)
 }

 .dp-float {
     position: absolute;
     z-index: 2;
     background: rgba(255, 255, 255, .94);
     backdrop-filter: blur(10px);
     border: 1px solid rgba(197, 138, 27, .15);
     box-shadow: 0 14px 34px rgba(0, 0, 0, .08);
     border-radius: 12px;
     padding: 15px 15px
 }

 .dp-float.top {
     left: 22px;
     top: 22px;
     max-width: 360px
 }

 .dp-float.bottom {
     left: 20px;
     bottom: 22px;
     max-width: calc(100% - 100px);
     background: #1f2730;
     color: #fff;
     border-color: rgba(255, 255, 255, .08)
 }

 .dp-float .label {
     font-size: 1.25rem;
     letter-spacing: .14em;
     text-transform: uppercase;
     font-weight: 900;
     color: var(--gold-dark);
     margin-bottom: 6px
 }

 .dp-float.bottom .label {
     color: #f0d7ae
 }

 .dp-float .value {
     font-size: 1rem;
     line-height: 1.12;
     margin-bottom: 0;
     color: var(--text)
 }

 .dp-float.bottom .value {
     color: #fff;
     font-size: 1.25rem;
     line-height: 1.12;
     font-style: italic;
     margin: 0;
 }

 .dp-quick {
     position: absolute;
     left: 22px;
     bottom: 22px;
     z-index: 2;
     display: flex;
     gap: 10px;
     flex-wrap: wrap;
     max-width: 90%
 }

 .dp-quick span {
     display: inline-flex;
     align-items: center;
     gap: 5px;
     padding: 7px 7px;
     border-radius: 999px;
     background: rgba(255, 255, 255, .92);
     color: #56431f;
     font-size: .86rem;
     border: 1px solid rgba(154, 106, 17, .12)
 }

 .dp-quick i {
     color: var(--gold)
 }

 .dp-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 8px;
     margin-top: 20px
 }

 .dp-stat {
     background: rgba(255, 255, 255, .55);
     border: 1px solid rgba(255, 255, 255, .55);
     border-radius: 15px;
     padding: 12px 10px;
     box-shadow: 0 10px 24px rgba(0, 0, 0, .03)
 }

 .dp-stat .num {
     font-family: Georgia, 'Times New Roman', serif;
     font-size: 1.8rem;
     line-height: 1;
     color: var(--gold-dark);
     display: block
 }

 .dp-stat .txt {
     margin-top: 8px;
     font-size: .9rem;
     line-height: 1.5;
     color: #4e5763
 }

 @media (max-width: 991.98px) {
     .dp-left {
         padding: 30px 12px 20px
     }

     .dp-right {
         padding: 0
     }

     .dp-photo-card {
         min-height: 460px
     }

     .dp-grid {
         grid-template-columns: repeat(2, 1fr)
     }

     .dp-name {
         max-width: none
     }
 }

 @media (max-width: 575.98px) {
     .dp-wrap {
         padding: 42px 0 0
     }

     .dp-shell {
         border-radius: 26px
     }

     .dp-summary {
         font-size: .9rem;
         line-height: 1.75
     }

     .dp-grid {
         grid-template-columns: 1fr
     }

     .dp-float.top {
         display: none;
     }

     .dp-float.bottom {
         left: 14px;
         right: 14px;
         max-width: none
     }

     .dp-quick {
         left: 14px;
         right: 14px;
         max-width: none
     }
 }



 /* about page */

 .abp-section-pad {
     padding: 60px 0;
 }

 .abp-section-pad h2 {
     font-weight: 800;
 }

 .abp-eyebrow {
     letter-spacing: 2.5px;
     text-transform: uppercase;
     font-size: .8rem;
     font-weight: 600;
     color: var(--gold-dark);
     display: inline-flex;
     align-items: center;
     gap: 10px;
 }

 .abp-eyebrow::before {
     content: "";
     width: 32px;
     height: 2px;
     background: var(--gold);
     display: inline-block;
 }

 .abp-text-gold {
     color: var(--gold);
 }

 .abp-lead-copy {
     color: var(--text);
     font-size: 1rem;
     line-height: 1.75;
 }

 .abp-btn-gold {
     background: linear-gradient(135deg, var(--gold), var(--gold-dark));
     border: none;
     color: #fff;
     padding: 14px 34px;
     border-radius: 50px;
     font-weight: 600;
     letter-spacing: .5px;
     transition: .35s;
     box-shadow: 0 10px 25px -8px rgba(197, 138, 27, .55);
 }

 .abp-btn-gold:hover {
     transform: translateY(-3px);
     box-shadow: 0 16px 30px -8px rgba(197, 138, 27, .65);
     color: #fff;
 }

 .abp-btn-outline-gold {
     border: 1.5px solid var(--gold);
     color: var(--gold-dark);
     padding: 13px 32px;
     border-radius: 50px;
     font-weight: 600;
     background: transparent;
     transition: .3s;
 }

 .abp-btn-outline-gold:hover {
     background: var(--gold);
     color: #fff;
 }

 /* ===== ABOUT INTRO ===== */
 .abp-about-intro {
     border-bottom: 1px solid var(--line);
 }

 .abp-intro-title {
     font-size: clamp(1.75rem, 2.5vw, 2.6rem);
     font-weight: 800;
     line-height: 1.2;
 }

 /* ===== DOCTOR SECTION ===== */
 .abp-doctor-wrap {
     background: var(--white);
     border-radius: 24px;
     padding: 30px;
     border: 1px solid var(--line);
 }

 .abp-doctor-photo-frame {
     position: relative;
     border-radius: 20px;
     overflow: hidden;
     /* aspect-ratio: 4/5; */
     background: linear-gradient(160deg, var(--gold), var(--gold-dark));
     display: flex;
     align-items: center;
     justify-content: center;
 }

 .abp-doctor-photo-frame i {
     font-size: 7rem;
     color: rgba(255, 255, 255, .5);
 }

 .abp-badge-gold {
     position: absolute;
     bottom: 16px;
     left: 16px;
     right: 16px;
     background: rgba(255, 255, 255, .94);
     border-radius: 14px;
     padding: 14px 18px;
     box-shadow: 0 12px 25px -10px rgba(0, 0, 0, .25);
 }

 .abp-badge-gold h5 {
     margin: 0;
     font-size: 1.05rem;
     font-weight: 700;
 }

 .abp-badge-gold span {
     font-size: .8rem;
     color: var(--muted);
 }

 .abp-cred-pill {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     background: rgba(197, 138, 27, .1);
     color: var(--gold-dark);
     border-radius: 50px;
     padding: 8px 16px;
     font-size: .82rem;
     font-weight: 600;
     margin: 4px 6px 0 0;
 }

 .abp-doctor-quote {
     border-left: 3px solid var(--gold);
     padding-left: 20px;
     font-family: 'Playfair Display', serif;
     font-style: italic;
     color: var(--text);
     font-size: 1.25rem;
     font-weight: 700;
     margin: 26px 0;
 }

 /* ===== PHILOSOPHY ===== */
 .abp-philo-card {
     background: var(--white);
     border-radius: 15px;
     padding: 15px;
     height: 100%;
     border: 1px solid var(--line);
     transition: .35s;
     position: relative;
     overflow: hidden;
 }

 .abp-philo-card::after {
     content: "";
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, rgba(197, 138, 27, .08), transparent);
     opacity: 0;
     transition: .35s;
 }

 .abp-philo-card:hover {
     transform: translateY(-8px);
     box-shadow: 0 25px 45px -20px rgba(197, 138, 27, .35);
 }

 .abp-philo-card:hover::after {
     opacity: 1;
 }

 .abp-philo-icon {
     width: 50px;
     height: 50px;
     flex-shrink: 0;
     border-radius: 16px;
     background: linear-gradient(135deg, var(--gold), var(--gold-dark));
     display: flex;
     align-items: center;
     justify-content: center;
     color: #fff;
     font-size: 1.25rem;
 }

 .abp-philo-card h4 {
     font-size: 1.5rem;
     font-weight: 700;
     margin-bottom: 0;
 }

 .abp-philo-card p {
     color: var(--muted);
     font-size: .93rem;
     margin: 0;
 }

 /* ===== LIFE STAGES TIMELINE ===== */
 .abp-stage-track {
     position: relative;
 }

 .abp-stage-track::before {
     content: "";
     position: absolute;
     left: 29px;
     top: 12px;
     bottom: 12px;
     width: 2px;
     background: linear-gradient(180deg, var(--gold), transparent);
 }

 .abp-stage-item {
     position: relative;
     padding-left: 78px;
     margin-bottom: 44px;
 }

 .abp-stage-item:last-child {
     margin-bottom: 0;
 }

 .abp-stage-dot {
     position: absolute;
     left: 0;
     top: 0;
     width: 60px;
     height: 60px;
     border-radius: 50%;
     background: var(--white);
     border: 2px solid var(--gold);
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--gold-dark);
     font-size: 1.4rem;
     box-shadow: 0 8px 18px -8px rgba(197, 138, 27, .4);
 }

 .abp-stage-item h4 {
     margin-bottom: 8px;
 }

 .abp-stage-item p {
     color: var(--muted);
     margin: 0;
 }

 /* ===== TREATMENTS GRID ===== */
 .abp-treat-card {
     background: var(--white);
     border: 1px solid var(--line);
     border-radius: 16px;
     padding: 24px 18px;
     text-align: center;
     height: 100%;
     transition: .3s;
     display: flex;
     flex-direction: column;
     justify-content: center;
 }

 .abp-treat-card:hover {
     background: linear-gradient(135deg, var(--gold), var(--gold-dark));
     color: #fff;
     transform: translateY(-6px);
 }

 .abp-treat-card:hover .abp-treat-icon {
     color: #fff;
 }

 .abp-treat-card:hover p {
     color: rgba(255, 255, 255, .9);
 }

 .abp-treat-icon {
     font-size: 1.8rem;
     color: var(--gold);
     margin-bottom: 14px;
     display: block;
 }

 .abp-treat-card p {
     margin: 0;
     font-weight: 600;
     font-size: .9rem;
     color: var(--text);
     line-height: 1.4;
 }

 /* ===== WHY CHOOSE ===== */
 .abp-why-section {
     background: linear-gradient(160deg, var(--text) 0%, #2b3541 100%);
     color: var(--sfoot-text);
     border-radius: 28px;
     padding: 40px 30px;
 }

 .abp-why-section h2 {
     color: var(--sfoot-heading);
 }

 .abp-why-section p {
     color: rgba(249, 249, 249, .8);
     line-height: 1.75;
 }

 /* ===== CLOSING CTA ===== */
 .abp-cta-final {
     padding: 80px 20px;
     background: var(--bg);
 }

 .abp-cta-final .abp-stripline {
     font-family: 'Playfair Display', serif;
     font-style: italic;
     font-size: 1.6rem;
     color: var(--gold-dark);
     margin-bottom: 10px;
 }

 .abp-cta-final h2 {
     font-size: 2.2rem;
     margin-bottom: 10px;
 }

 .abp-cta-final .abp-brand-line {
     color: var(--muted);
     font-weight: 500;
     margin-bottom: 30px;
 }

 @media(max-width:767px) {
     .abp-about-intro h2 {
         font-size: 1.9rem;
     }

     .abp-doctor-wrap {
         padding: 12px;
     }

     .abp-why-section {
         padding: 20px 12px;
     }
 }



 /* contact page */

 .cu-shell {
     min-height: 100vh;
     position: relative;
     overflow: hidden;
     background:
         radial-gradient(circle at 88% 6%, rgba(197, 138, 27, .22), transparent 26rem),
         radial-gradient(circle at 4% 96%, rgba(197, 138, 27, .16), transparent 22rem),
         linear-gradient(135deg, #fbf5e9, var(--bg) 55%, #ecdab9);
 }

 .cu-wrap {
     position: relative;
     z-index: 1;
     padding: 60px 0 60px;
 }

 .cu-header {
     max-width: 740px;
     margin: 0 auto 50px;
     text-align: center;
 }

 .cu-kicker {
     display: inline-flex;
     align-items: center;
     gap: 12px;
     color: var(--gold-dark);
     font-size: .74rem;
     font-weight: 700;
     letter-spacing: .2em;
     text-transform: uppercase;
 }

 .cu-kicker::before,
 .cu-kicker::after {
     content: "";
     width: 30px;
     height: 1px;
     background: var(--gold);
 }

 .cu-title {
     margin: 18px 0 14px;
     font-size: clamp(2.4rem, 4.5vw, 3.4rem);
 }

 .cu-title em {
     color: var(--gold);
     font-style: italic;
 }

 .cu-sub {
     color: var(--muted);
     font-size: 1.05rem;
     line-height: 1.8;
 }

 .cu-card {
     border: 1px solid rgba(255, 255, 255, .8);
     border-radius: 28px;
     background: rgba(255, 253, 250, .8);
     box-shadow: 0 28px 80px rgba(80, 53, 15, .16);
     backdrop-filter: blur(16px);
 }

 .cu-form {
     padding: clamp(26px, 4vw, 50px);
 }

 .cu-form h2,
 .cu-contact h2 {
     margin-bottom: 8px;
     font-size: 2rem;
     fwont-weight: 900;
 }

 .cu-note {
     color: var(--muted);
     margin-bottom: 28px;
 }

 .cu-label {
     display: block;
     margin-bottom: 8px;
     font-size: .78rem;
     font-weight: 700;
 }

 .cu-input {
     border: 1px solid var(--line);
     border-radius: 12px;
     padding: 14px 15px;
     color: var(--text);
     background: rgba(255, 255, 255, .68);
 }

 .cu-input::placeholder {
     color: #9ca0a5;
 }

 .cu-input:focus {
     border-color: var(--gold);
     box-shadow: 0 0 0 .22rem rgba(197, 138, 27, .14);
 }

 textarea.cu-input {
     min-height: 132px;
     resize: vertical;
 }

 .cu-submit {
     border: 0;
     border-radius: 12px;
     padding: 14px 26px;
     color: #fff;
     background: var(--gold);
     font-weight: 700;
     transition: .25s ease;
 }

 .cu-submit:hover {
     color: #fff;
     background: var(--gold-dark);
     transform: translateY(-2px);
     box-shadow: 0 12px 22px rgba(154, 106, 17, .24);
 }

 .cu-contact {
     position: relative;
     height: 100%;
     padding: clamp(26px, 4vw, 44px);
     color: var(--sfoot-text);
     overflow: hidden;
     background: var(--text);
 }

 .cu-contact::before {
     content: "";
     position: absolute;
     right: -95px;
     top: -108px;
     width: 280px;
     height: 280px;
     border: 1px solid rgba(197, 138, 27, .65);
     border-radius: 50%;
     box-shadow: 0 0 0 28px rgba(197, 138, 27, .07), 0 0 0 60px rgba(255, 255, 255, .04);
 }

 .cu-contact h2 {
     position: relative;
     color: var(--sfoot-heading);
 }

 .cu-contact .cu-note {
     position: relative;
     color: rgba(249, 249, 249, .63);
     line-height: 1.75;
 }

 .cu-details {
     position: relative;
     margin-top: 34px;
 }

 .cu-detail {
     display: flex;
     align-items: flex-start;
     gap: 15px;
     margin-bottom: 24px;
 }

 .cu-icon {
     display: grid;
     flex: 0 0 43px;
     place-items: center;
     width: 43px;
     height: 43px;
     color: #e8bb62;
     border: 1px solid rgba(197, 138, 27, .55);
     border-radius: 13px;
 }

 .cu-detail small {
     display: block;
     margin-bottom: 4px;
     color: rgba(249, 249, 249, .48);
     font-size: .68rem;
     letter-spacing: .14em;
     text-transform: uppercase;
 }

 .cu-detail address,
 .cu-detail a {
     margin: 0;
     color: var(--sfoot-text);
     font-style: normal;
     line-height: 1.55;
 }

 .cu-detail a:hover {
     color: #e8bb62;
 }

 .cu-map {
     position: relative;
     min-height: 190px;
     margin-top: 32px;
     border-radius: 19px;
     overflow: hidden;
     background-color: #cbb27d;
     background-image: linear-gradient(24deg, transparent 47%, rgba(255, 255, 255, .42) 48%, rgba(255, 255, 255, .42) 51%, transparent 52%), linear-gradient(110deg, transparent 45%, rgba(255, 255, 255, .26) 46%, rgba(255, 255, 255, .26) 51%, transparent 52%);
     background-size: 100% 82px, 90px 100%;
 }

 .cu-map::after {
     content: "";
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, rgba(31, 39, 48, .22), transparent 60%);
 }

 .cu-pin {
     position: absolute;
     z-index: 2;
     top: 50%;
     left: 50%;
     display: grid;
     place-items: center;
     width: 51px;
     height: 51px;
     color: #fff;
     background: var(--gold);
     border: 6px solid rgba(255, 255, 255, .78);
     border-radius: 50% 50% 50% 4px;
     box-shadow: 0 13px 25px rgba(31, 39, 48, .28);
     transform: translate(-50%, -60%) rotate(-45deg);
 }

 .cu-pin i {
     transform: rotate(45deg);
 }

 .cu-map-label {
     position: absolute;
     z-index: 2;
     bottom: 13px;
     left: 14px;
     padding: 7px 11px;
     color: var(--text);
     background: rgba(255, 253, 250, .9);
     border-radius: 8px;
     font-size: .72rem;
     font-weight: 700;
 }

 @media (max-width: 575.98px) {
     .cu-wrap {
         padding: 45px 0 55px;
     }

     .cu-header {
         margin-bottom: 34px;
     }

     .cu-card {
         border-radius: 20px;
     }

     .cu-form,
     .cu-contact {
         padding: 24px;
     }

 }


 /* journey section */


 .stj-slider-wrap {
     padding: 70px 0
 }

 .stj-slider-box {
     background: #f7f0e5;
     /* border-radius: 28px; */
     /* padding: 40px; */
     /* box-shadow: 0 22px 50px rgba(44, 28, 8, .08) */
 }

 .stj-slider-title {
     font-family: "Cormorant Garamond", serif;
     font-size: clamp(2rem, 4vw, 3rem);
     line-height: .95;
     margin: 0 0 18px;
     color: #1f2328
 }

 .stj-slider-sub {
     font-size: 1rem;
     color: #3f4a56;
     margin-bottom: 34px
 }

 .stj-slider-step {
     display: grid;
     grid-template-columns: 72px 1fr;
     gap: 20px;
     align-items: flex-start;
     padding: 18px 0;
     cursor: pointer;
     position: relative
 }

 .stj-slider-step+.stj-slider-step {
     margin-top: 4px
 }

 .stj-slider-step::before {
     content: '';
     position: absolute;
     left: 34px;
     top: 0;
     bottom: 0;
     width: 2px;
     background: rgba(200, 141, 43, .22)
 }

 .stj-slider-step-num {
     font-size: 1rem;
     letter-spacing: .08em;
     color: #29303a;
     opacity: .85;
     padding-top: 10px
 }

 .stj-slider-step.active .stj-slider-step-num {
     color: var(--gold)
 }

 .stj-slider-step.active::after {
     content: '';
     position: absolute;
     left: 34px;
     top: 0;
     width: 2px;
     height: 100%;
     background: linear-gradient(180deg, rgba(200, 141, 43, .05), rgba(200, 141, 43, .6), rgba(200, 141, 43, .05))
 }

 .stj-slider-step-content {
     padding: 0 0 0 2px
 }

 .stj-slider-step h3 {
     font-family: "Cormorant Garamond", serif;
     font-size: clamp(1.45rem, 2vw, 2.3rem);
     line-height: 1.08;
     margin: 0;
     color: #20262d;
     transition: .25s ease
 }

 .stj-slider-step.active h3 {
     color: var(--gold-soft);
 }

 .stj-slider-step p {
     margin: 14px 0 0;
     max-width: 290px;
     font-size: 1rem;
     line-height: 1.55;
     color: #25303d
 }

 .stj-slider-step:not(.active) p {
     display: none
 }

 .stj-slider-visual {
     position: relative;
     border-radius: 28px;
     overflow: hidden;
     min-height: 690px;
     background: #ddd;
     box-shadow: 0 22px 50px rgba(44, 28, 8, .08)
 }

 .stj-slide {
     position: absolute;
     inset: 0;
     opacity: 0;
     transform: scale(1.03);
     transition: opacity .5s ease, transform .7s ease;
     background-size: cover;
     background-position: center
 }

 .stj-slide.active {
     opacity: 1;
     transform: scale(1)
 }

 .stj-slide::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(0, 0, 0, .2))
 }

 .stj-card {
     position: absolute;
     right: 22px;
     bottom: 18px;
     z-index: 2;
     background: #fff;
     border-radius: 24px;
     padding: 22px 22px 18px;
     max-width: 285px;
     box-shadow: 0 18px 40px rgba(0, 0, 0, .14)
 }

 .stj-card i {
     color: var(--gold);
     font-size: 1.1rem;
     margin-bottom: 14px
 }

 .stj-card p {
     margin: 0 0 10px;
     font-size: 1rem;
     line-height: 1.45;
     color: #1f2730
 }

 .stj-card a {
     color: var(--gold);
     text-decoration: none;
     font-size: .98rem
 }

 .stj-card a i {
     font-size: .85rem;
     margin-left: 6px
 }

 @media (max-width: 991.98px) {
     .stj-slider-box {
         padding: 24px 0
     }

     .stj-slider-visual {
         min-height: 420px;
         margin-top: 28px
     }

     .stj-slider-step {
         grid-template-columns: 56px 1fr;
         gap: 12px
     }

     .stj-slider-step:not(:last-child)::before,
     .stj-slider-step.active::after {
         left: 26px
     }

     .stj-card {
         left: 16px;
         right: 16px;
         bottom: 16px;
         max-width: none
     }
 }



 /* faq section  */

 .faq-wrap {
     padding: 70px 0;
     background: rgba(255, 255, 255, .88);
 }

 .faq-shell {
     background: rgba(255, 255, 255, .18);
     border: 1px solid rgba(255, 255, 255, .35);
     border-radius: 34px;
     padding: 40px;
     box-shadow: 0 20px 50px rgba(40, 28, 8, .06);
 }

 .faq-left {
     padding-right: 28px;
 }

 .faq-kicker {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     font-size: .82rem;
     letter-spacing: .16em;
     text-transform: uppercase;
     color: var(--gold-dark);
     font-weight: 700;
     margin-bottom: 18px;
 }

 .faq-kicker::before {
     content: '';
     width: 42px;
     height: 2px;
     background: var(--gold);
     border-radius: 999px;
 }

 .faq-title {
     font-family: 'Cormorant Garamond', serif;
     font-size: clamp(2rem, 3.8vw, 4rem);
     line-height: .94;
     margin: 0 0 18px;
 }

 .faq-desc {
     font-size: 1rem;
     line-height: 1.8;
     color: var(--muted);
     margin: 0 0 15px;
 }

 .faq-badge-row {
     display: flex;
     flex-wrap: wrap;
     gap: 10px;
 }

 .faq-badge {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 8px 14px;
     border-radius: 999px;
     background: #fff7ec;
     color: var(--gold-dark);
     font-size: .92rem;
     border: 1px solid rgba(197, 138, 27, .18);
 }

 .faq-panel {
     padding-left: 10px;
 }

 .faq-accordion .accordion-item {
     border: 0;
     background: transparent;
     border-bottom: 1px solid rgba(154, 106, 17, .14);
 }

 .faq-accordion .accordion-button {
     background: transparent;
     color: var(--text);
     font-family: 'Cormorant Garamond', serif;
     font-size: 1.5rem;
     line-height: 1.4;
     font-weight: 600;
     padding: 1.15rem 0;
     box-shadow: none;
 }

 .faq-accordion .accordion-button:not(.collapsed) {
     color: var(--gold-dark);
 }

 .faq-accordion .accordion-button::after {
     display: none;
 }

 .faq-toggle {
     margin-left: auto;
     color: var(--gold);
     font-size: 2rem;
     line-height: 1;
     min-width: 24px;
     text-align: center;
     transition: transform .25s ease, color .25s ease;
 }

 .faq-accordion .accordion-button[aria-expanded="true"] .faq-toggle {
     transform: rotate(45deg);
     color: var(--gold-dark);
 }

 .faq-accordion .accordion-body {
     padding: 0 0 1rem 0;
     color: var(--muted);
     font-size: 1rem;
     line-height: 1.8;
 }

 .faq-accordion .accordion-button:focus {
     box-shadow: none;
 }

 @media (max-width: 991.98px) {
     .faq-shell {
         padding: 28px
     }

     .faq-left {
         padding-right: 0;
         margin-bottom: 22px
     }

     .faq-panel {
         padding-left: 0
     }

     .faq-accordion .accordion-button {
         font-size: 1.08rem
     }

 }

 @media (max-width: 575.98px) {
     .faq-wrap {
         padding: 42px 0
     }

     .faq-shell {
         padding: 22px;
         border-radius: 26px
     }

     .faq-desc {
         font-size: .98rem;
         line-height: 1.7
     }

     .faq-badge {
         font-size: .85rem
     }
 }



 /* breadcrumb */

 .breadcrumb-section {
     background-image: url('../images/breadcrumb.png');
     background-size: cover;
     background-position: center;
     padding: 100px 0;
     margin-top: 73px;
     position: relative;
 }

 .breadcrumb-section::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.65);
 }

 .breadcrumb-title {
     position: relative;
     font-size: clamp(2.25rem, 4vw, 4.5rem);
     font-weight: bold;
     color: #fff;
 }



 /* service page  */

 .sp-wrapper {
     padding: 50px 0;
 }

 .sp-hero-img {
     width: 100%;
     border-radius: 16px;
     margin-bottom: 20px;
     box-shadow: 0 12px 30px rgba(90, 50, 140, .12);
 }

 .sp-content h2 {
     color: var(--gold-dark);
     font-weight: 700;
     font-size: clamp(22px, 4vw, 32px);
     margin-bottom: 15px;
 }

 .sp-content h3 {
     color: var(--gold-dark);
     font-weight: 700;
     font-size: clamp(20px, 3.5vw, 28px);
     margin: 0 0 18px;
     padding-left: 14px;
     border-left: 4px solid var(--gold-dark);
 }

 .sp-content p {
     line-height: 1.8;
     margin-bottom: 16px;
     font-size: 16px;
     font-weight: 400;
 }

 .sp-list-grid {
     list-style: none;
     padding: 0;
     margin: 0 0 20px;
 }

 .sp-list-grid li {
     position: relative;
     padding-left: 25px;
     font-weight: 400;
     font-size: 15px;
     line-height: 1.6;
     margin-bottom: 15px;
 }

 .sp-list-grid li::before {
     content: "\f5c9";
     font-family: "Font Awesome 6 Free";
     font-weight: 900;
     color: var(--gold);
     position: absolute;
     left: 5px;
     top: 0;
 }

 .sp-card-box {
     background: #fff;
     border: 1px solid var(--gold);
     border-radius: 14px;
     padding: 28px;
     margin-bottom: 10px;
     box-shadow: 0 6px 18px rgba(90, 50, 140, .06);
 }

 .sp-why-box {
     background: linear-gradient(135deg, #3a1f6b, #6d3fae);
     color: #fff;
     border-radius: 16px;
     padding: 32px;
     margin: 34px 0;
 }

 .sp-why-box h3 {
     color: #fff;
     border-left: 4px solid #fff;
 }

 .sp-why-box p {
     color: #e7ddf5;
     margin-bottom: 0;
 }

 .sp-alert-box {
     background: #fff5f8;
     border: 1px solid #f5c9dc;
     border-radius: 14px;
     padding: 28px;
 }

 .sp-alert-box h3 {
     color: var(--gold-dark);
     border-left: 4px solid var(--gold-dark);
     margin-top: 0;
 }

 .sp-alert-box ul {
     padding-left: 0;
     list-style: none;
     margin-bottom: 14px;
 }

 .sp-alert-box ul li {
     position: relative;
     padding-left: 26px;
     margin-bottom: 10px;
     font-weight: 400;
     font-size: 15px;
 }

 .sp-alert-box ul li::before {
     content: "\f5c9";
     font-family: "Font Awesome 6 Free";
     font-weight: 900;
     color: #e0447a;
     position: absolute;
     left: 4px;
     top: 1px;
     font-size: 13px;
 }

 .sp-alert-note {
     font-style: italic;
     color: var(--gold-dark);
     font-weight: 600;
     font-size: 15px;
     margin-bottom: 0 !important;
 }

 .sp-sidebar>div {
     margin-bottom: 26px;
 }

 .sp-side-card {
     background: #fff;
     border-radius: 16px;
     box-shadow: 0 8px 22px rgba(90, 50, 140, .08);
     overflow: hidden;
 }

 .sp-doc-card {
     text-align: center;
     padding-bottom: 22px;
 }

 .sp-doc-card img {
     width: 100%;
     /* height: 220px; */
     object-fit: cover;
     background: var(--bg);
 }

 .sp-doc-card .sp-doc-info {
     padding: 18px 20px 0;
 }

 .sp-doc-card h2 {
     color: var(--gold-dark);
     font-weight: 700;
     margin-bottom: 2px;
 }

 .sp-doc-card .sp-doc-role {
     color: var(--gold-dark);
     font-size: 13.5px;
     font-weight: 600;
     margin-bottom: 10px;
 }

 .sp-doc-card .sp-doc-desc {
     font-size: 13.5px;
     color: var(--text);
     padding: 0 6px;
     margin-bottom: 14px;
 }

 .sp-doc-social a {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     width: 34px;
     height: 34px;
     border-radius: 50%;
     background: var(--bg);
     color: var(--gold-dark);
     margin: 0 4px;
     font-size: 14px;
     transition: .2s;
 }

 .sp-doc-social a:hover {
     background: var(--gold-dark);
     color: #fff;
 }

 .sp-side-title {
     background: var(--gold-dark);
     color: #fff;
     font-weight: 700;
     font-size: 16px;
     padding: 16px 20px;
     margin: 0;
 }

 .sp-service-list {
     list-style: none;
     padding: 14px 0 0;
     margin: 0;
 }

 .sp-service-list li a {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 11px 12px;
     color: var(--ink);
     text-decoration: none;
     border-bottom: 1px solid var(--bg);
     font-size: 14.5px;
     transition: .2s;
     border-left: 3px solid transparent;
 }

 .sp-service-list li:last-child a {
     border-bottom: none;
 }

 .sp-service-list li a:hover,
 .sp-service-list li a.active {
     background: var(--gold-dark);
     color: #fff;
     border-left: 3px solid var(--gold-dark);
     font-weight: 500;
 }

 .sp-service-list li a i.fa-chevron-right {
     font-size: 11px;
     color: var(--gold-dark);
 }

 .sp-contact-card {
     padding: 18px 12px;
 }

 .sp-contact-item {
     display: flex;
     gap: 10px;
     margin-bottom: 16px;
     align-items: flex-start;
 }

 .sp-contact-item:last-child {
     margin-bottom: 0;
 }

 .sp-contact-icon {
     width: 38px;
     height: 38px;
     background: var(--bg);
     color: var(--gold-dark);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
     font-size: 14px;
 }

 .sp-contact-item h6 {
     font-size: 15.5px;
     font-weight: 700;
     color: var(--gold-dark);
     margin-bottom: 2px;
 }

 .sp-contact-item p {
     font-size: 13.5px;
     margin-bottom: 0;
     color: var(--text);
 }

 .sp-form-card {
     padding: 20px 12px 20px;
 }

 .sp-form-card .form-label {
     font-size: 13px;
     font-weight: 600;
     color: var(--gold-dark);
     margin-bottom: 5px;
 }

 .sp-form-card .form-control,
 .sp-form-card .form-select {
     border: 1px solid var(--muted);
     border-radius: 8px;
     font-size: 14px;
     padding: 10px 12px;
     background: var(--white);
 }

 .sp-form-card .form-control:focus,
 .sp-form-card .form-select:focus {
     border-color: var(--gold-dark);
     box-shadow: 0 0 0 3px rgba(109, 63, 174, .12);
     background: #fff;
 }

 .sp-btn-submit {
     background: linear-gradient(135deg, var(--gold-dark), var(--gold));
     color: #fff;
     border: none;
     border-radius: 8px;
     padding: 12px;
     font-weight: 600;
     width: 100%;
     font-size: 15px;
     letter-spacing: .3px;
     transition: .2s;
 }

 .sp-btn-submit:hover {
     opacity: .9;
     color: #fff;
 }

 @media (max-width:991px) {
     .sp-list-grid {
         grid-template-columns: 1fr;
     }

     .sp-sidebar {
         margin-top: 40px;
     }

     .sp-card-box {
         padding: 20px 12px;
     }

     .sp-alert-box {
         padding: 20px 12px;
     }

     .sp-alert-box ul li {
         font-size: 14px;
         padding-left: 22px;
     }
 }