/* --------------------------------------------------
   RESET (Safe with Bootstrap, prevents conflicts)
-------------------------------------------------- */
* { margin:0; padding:0; box-sizing:border-box; }
ul,ol { list-style:none; }
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
button,input,select,textarea { font-family:inherit; outline:none; border:none; background:none; }
:root { --accent-blue:#3d8ff5; --primary-dark:#2e3a47; --text-dark:#2E3A46; }
body { font-family:'Inter', sans-serif; color:var(--text-dark); }

/* --------------------------------------------------
   Header
-------------------------------------------------- */
.cl-p {padding: 0 3.125rem;}
.custom-navbar { background:rgba(250, 250, 252, .8); backdrop-filter:saturate(180%) blur(20px); -webkit-backdrop-filter:saturate(180%) blur(20px); border-bottom:1px solid rgba(255,255,255,.25); }
.custom-brand { font-size:1rem; font-weight:600; color:var(--primary-dark); }
.custom-menu { padding-left:1rem; padding-right:1rem; }
.custom-nav { display:flex; gap:1.875rem; align-items:center; }
.custom-link { font-size:0.75rem; font-weight:500; color:var(--primary-dark); transition:.3s; }
.custom-link:hover, .custom-link.active {color:var(--accent-blue) !important;}
.custom-toggler { border:none; }

/* --------------------------------------------------
   Hero Section
-------------------------------------------------- */
.hero { position:relative; overflow:hidden; }
.custom-hero-carousel {overflow:hidden; }
.carousel-item { overflow:hidden; }
.custom-hero-carousel .carousel-item img {object-fit:cover;width:102%;height:102%;margin-left:-1%;margin-top:-1%;}
.desktop-img { display:block; }
.mobile-img { display:none; }
.kenburns { animation:kenzoom 12s ease-in-out infinite; transform-origin:center; }
@keyframes kenzoom { 0% {transform:scale(1);} 100% {transform:scale(1.15);} }
.hero-overlay {position:absolute; top:0; left:0;width:100%; height:100%;padding-left:3.125rem;display:flex; align-items:center;z-index:5; pointer-events:none;background:linear-gradient(to right, rgba(0,0,0,.45), rgba(0,0,0,0));}
.hero-content { max-width:32.5rem; opacity:0; pointer-events:auto; }
.slide-anim { animation:fadeSlide 1s ease forwards; }
@keyframes fadeSlide { 0% {opacity:0; transform:translateY(1.25rem);} 100% {opacity:1; transform:translateY(0);} }
.hero-title { font-size:2.5rem; font-weight:700; color:#fff; margin-bottom:1rem; }
.hero-subtitle { font-size:1rem; color:#f0f0f0; line-height:1.6; margin-bottom:1.5rem; max-width:26.25rem; }
.hero-btn {display:inline-block;background:#fff;border:0.0625rem solid #ddd;padding:0.75rem 1.5rem;border-radius:0.375rem;font-size:0.95rem;font-weight:500;transition:.3s;}
.hero-btn:hover { background:var(--accent-blue); color:#fff; border-color:var(--accent-blue);}


.clarity-section { padding:5rem 0; background:#fff; }
.clarity-wrap { gap:3rem; }
.clarity-image-wrap { position:relative; width:100%; max-width:32rem; }
.clarity-image { width:100%; border-radius:1rem; position:relative; z-index:3; }
.clarity-image-wrap::before { content:""; position:absolute; top:-1.5rem; left:-1.5rem; width:6rem; height:6rem; background:url('../images/shape_1.png') no-repeat center/contain; z-index:1; opacity:0.45; }
.clarity-image-wrap::after { content:""; position:absolute; bottom:-1.5rem; right:-1.5rem; width:6rem; height:6rem; background:url('../images/shape_2.png') no-repeat center/contain; z-index:1; opacity:0.45; }
.clarity-content { max-width:38rem; }

.clarity-title { font-size:2rem; font-weight:700; color:#2E3A46; margin-bottom:1rem; }
.clarity-text { font-size:1rem; color:#555; line-height:1.7; margin-bottom:2.5rem; }
.clarity-icons { display:flex; gap:2.5rem; align-items:center; }
.clarity-item { text-align:center; display:flex; flex-direction:column; align-items:center; }
.clarity-icon { width:1.75rem; height:1.75rem; margin-bottom:0.5rem; }
.clarity-label { font-size:1rem; font-weight:500; color:#2E3A46; }
.clarity-divider { width:1px; height:2rem; background:#ccc; opacity:0.6; }

/* ----------------------------
   Therapy Section
----------------------------- */
.therapy-section { padding:5rem 0; background:#eaf2fb; position:relative; overflow:hidden; }
.therapy-section::before {content:"";position:absolute;top:0;left:0;width:18rem;height:18rem;background:url('../images/shape_3.png') no-repeat center/contain;opacity:0.35;z-index:0;pointer-events:none;}
.therapy-section::after {content:"";position:absolute;bottom:-1rem;right:-1rem;width:18rem;height:18rem;background:url('../images/shape_3.png') no-repeat center/contain;opacity:0.35;transform:scaleX(-1);z-index:0;pointer-events:none;}
.therapy-title { font-size:2rem; font-weight:700; margin-bottom:3rem; color:#2E3A46; position:relative; z-index:5; }
.therapy-row { position:relative; z-index:5; }
.therapy-card { background:#fff; border-radius:1rem; padding:2rem; box-shadow:0 .25rem .8rem rgba(0,0,0,.06); text-align:center; height:100%; transition:.3s; }
.therapy-card:hover { transform:translateY(-0.5rem); box-shadow:0 .5rem 1.2rem rgba(0,0,0,.1); }
.therapy-icon-wrap { width:3.5rem; height:3.5rem; background:#3d8ff5; border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 1rem; }
.therapy-icon { width:1.5rem; height:1.5rem; filter:brightness(0) invert(1); }
.therapy-card-title { font-size:1.25rem; font-weight:600; color:#2E3A46; margin-bottom:1rem; }
.therapy-card-text { font-size:0.95rem; color:#555; line-height:1.6; }

/* ----------------------------
   Expertise Section
----------------------------- */
.expertise-section { padding:5rem 0; background:#fff; position:relative; overflow:hidden; }
.expertise-title { font-size:2rem; font-weight:700; margin-bottom:3rem; color:#2E3A46; }
.expert-left { position:relative; z-index:5; }
.expert-avatar { width:8rem; height:8rem; border-radius:50%; object-fit:cover; }
.expert-name { font-size:1.25rem; font-weight:700; margin-bottom:0.25rem; letter-spacing:1px; }
.expert-role { font-size:0.75rem; font-weight:600; color:#3d8ff5; margin-bottom:1rem; }
.expert-description { font-size:0.95rem; color:#444; line-height:1.6; margin-bottom:1.25rem; }
.expert-list { padding-left:1rem; color:#444; font-size:0.95rem; line-height:1.6; margin-top:1.25rem; list-style:none;}
.expert-list li { position:relative; padding-left:1rem; margin-bottom:0.5rem; font-size:0.95rem; color:#444; line-height:1.6; }
.expert-list li::before { content:""; position:absolute; left:0; top:0.55rem; width:0.35rem; height:0.35rem; background:#3d8ff5; border-radius:50%; opacity:0.85; }
.expert-image-wrap { position:relative; width:100%; z-index:5; }
.expert-image-wrap::before { content:""; position:absolute; top:-1.5rem; left:-1.5rem; width:6rem; height:6rem; background:url('../images/shape_2.png') no-repeat center/contain; opacity:0.25; z-index:1;}
.expert-image-wrap::after { content:""; position:absolute; bottom:-1.5rem; right:-1.5rem; width:6rem; height:6rem; background:url('../images/shape_1.png') no-repeat center/contain; opacity:0.25; z-index:1; }
.expert-main-image { width:100%; border-radius:0.75rem; position:relative; z-index:3; }

/* ----------------------------
   Growth Section
----------------------------- */
.growth-section { padding:5rem 0; background:#D9E2E8; position:relative; overflow:hidden; }
.growth-section::before { content:""; position:absolute; top:2rem; left:0; width:12rem; height:12rem; background:url('../images/shape_3.png') no-repeat center/contain; opacity:0.3; z-index:1; }
.growth-section::after { content:""; position:absolute; bottom:2rem; right:0; width:12rem; height:12rem; background:url('../images/shape_3.png') no-repeat center/contain; opacity:0.3; transform:scaleX(-1); z-index:1; }
.growth-title { font-size:2rem; font-weight:700; margin-bottom:3rem; color:#2E3A46; position:relative; z-index:5; }
.growth-card { background:#fff; border-radius:1rem; padding:2rem; box-shadow:0 .25rem .8rem rgba(0,0,0,.06); height:100%; position:relative; z-index:5; transition:.3s; }
.growth-card:hover { transform:translateY(-0.4rem); box-shadow:0 .5rem 1.2rem rgba(0,0,0,.1); }
.growth-book { width:120px; height:auto; margin:0 auto 1rem; display:block; }
.growth-meta { margin-bottom:0.5rem; }
.growth-author-icon { width:0.95rem; height:0.95rem; opacity:0.7; }
.growth-author { font-size:0.85rem; color:#444; margin:0; }
.growth-link { display:block; font-size:1rem; font-weight:600; color:#3d8ff5; margin-bottom:0.5rem; text-decoration:none; }
.growth-link:hover { text-decoration:underline; }
.growth-text { font-size:0.9rem; color:#444; line-height:1.6; }
.growth-btn { display:inline-block; margin-top:2rem; background:#3d8ff5; color:#fff; padding:0.75rem 2rem; border-radius:0.5rem; font-size:0.9rem; font-weight:500; transition:.3s; }
.growth-btn:hover { background:#2a74d4; }

/* ----------------------------
  Moment Section
----------------------------- */
.moments-section { padding:5rem 0; background:#fff; }
.moments-title { font-size:2rem; font-weight:700; color:#1a1a1a; margin-bottom:3rem; }
.moments-box { width:100%; overflow:hidden; border-radius:0.75rem; }
.moments-box-lg { height:22rem; }
.moments-box-sm { height:10.5rem; }
.moments-img { width:100%; height:100%; object-fit:cover; border-radius:0.75rem; display:block; }
.moments-btn { display:inline-block; background:#3d8ff5; color:#fff; padding:0.75rem 2rem; border-radius:0.5rem; font-size:0.9rem; font-weight:500; text-decoration:none; transition:.3s; }
.moments-btn:hover { background:#2a74d4; }
/* ----------------------------
   Wellness Section
----------------------------- */
.wellness-section { padding:5rem 0; background:#d7dee5; position:relative; overflow:hidden; }
.wellness-title { font-size:2rem; font-weight:700; color:#2E3A46; margin-bottom:3rem; text-align:center; z-index:5; position:relative; }
.wellness-img-box { width:100%; border-radius:0.75rem; overflow:hidden; position:relative; z-index:5; }
.wellness-img-box::before { content:""; position:absolute; top:-1.5rem; left:-1.5rem; width:6rem; height:6rem; background:url('../images/shape_1.png') no-repeat center/contain; z-index:1; }
.wellness-img-box::after { content:""; position:absolute; bottom:-1.5rem; right:-1.5rem; width:6rem; height:6rem; background:url('../images/shape_2.png') no-repeat center/contain; z-index:1; }
.wellness-img { width:100%; height:100%; object-fit:cover; display:block; position:relative; z-index:3; }
.wellness-form { position:relative; z-index:5; }
.wellness-input { width:100%; padding:1rem 1.25rem; border:1px solid #ddd; border-radius:0.5rem; font-size:0.95rem; background:#fff; transition:.3s; }
.wellness-input:focus { border-color:var(--accent-blue); box-shadow:0 0 0 0.25rem rgba(61,143,245,.25); }
.wellness-btn { width:100%; background:#2f3944; color:#fff; padding:1rem; border-radius:0.5rem; font-size:0.95rem; font-weight:500; border:none; transition:.3s; }
.wellness-btn:hover { background:#1f272e; }
/* ----------------------------
   Footer Section
----------------------------- */
.footer-section { background:#2C3947; padding:4rem 0 0; color:#cfd8df; }

.footer-top { padding-bottom:3rem; }

.footer-title { font-size:0.85rem; font-weight:700; color:#fff; margin-bottom:1.25rem; letter-spacing:0.5px; }

.footer-list { list-style:none; padding:0; margin:0; }

.footer-list li { margin-bottom:0.75rem; font-size:0.9rem; color:#cfd8df; line-height:1.6; display:flex; align-items:flex-start; gap:0.5rem; }

.footer-list a { color:#cfd8df; text-decoration:none; transition:.3s; }

.footer-list a:hover { color:#fff; }

.footer-icon { width:1rem; height:1rem; opacity:0.8; margin-top:0.25rem; }

/* COPYRIGHT */
.footer-bottom { background:#1b1f23; padding:1rem 0; text-align:center; font-size:0.85rem; color:#cfd8df; margin-top:2rem; }

/* ----------------------------
   Responsive
----------------------------- */
@media(max-width:767px){
  .footer-top { text-align:left; }
  .footer-list li { font-size:0.9rem; }
}


















/* --------------------------------------------------
   Responsive
-------------------------------------------------- */

@media(max-width:991px) {
  .hero-overlay { padding-left:1.25rem; }
  .custom-hero-carousel { height:32.5rem; }
  .custom-hero-carousel .carousel-item img { height:32.5rem; }
  .clarity-wrap { text-align:center; } 
  .clarity-image-wrap { margin-bottom:2rem; } 
  .clarity-image-wrap::before { top:-1rem; left:0; width:4rem; height:4rem; }
  .clarity-image-wrap::after { bottom:-1rem; right:0; width:4rem; height:4rem; }
  .expert-left { flex-direction:column; text-align:center; gap:1.5rem;align-items:center; } 
  .expert-description { text-align:left; } 
  .expert-list { text-align:left; }
  .expert-image-wrap { margin-top:2rem; }
  .expert-avatar { margin:0 auto; }
  .moments-box-lg { height:auto; } 
  .moments-box-sm { height:auto; } 
  .moments-img { height:auto;}
  
}

@media(max-width:767px) {
  .custom-nav { gap:0; }
  .custom-link { padding:0.75rem 0; }
  .desktop-img { display:none; }
  .mobile-img { display:block; }
  .hero-overlay {padding-left:1.25rem; padding-right:1.25rem;text-align:center; justify-content:center;background:linear-gradient(to bottom, rgba(0,0,0,.55), rgba(0,0,0,0));}
  .hero-content { max-width:100%; }
  .hero-title { font-size:1.8rem; }
  .custom-hero-carousel { height:30rem; }
  .custom-hero-carousel .carousel-item img { height:30rem; }
  .clarity-icons { flex-direction:column; gap:1.5rem; }
  .clarity-divider { display:none; }
  .therapy-title { font-size:1.75rem; }
  .therapy-card { padding:1.5rem; }
  .clarity-title { font-size:1.75rem; }
  .clarity-text { font-size:0.95rem; }
  .expertise-title { font-size:1.75rem; } 
  .expert-avatar { width:7rem; height:7rem; } 
  .growth-title { font-size:1.75rem; } .growth-card { padding:1.5rem; }
  .moments-title { font-size:1.75rem; }
  .wellness-section { padding:3rem 0; }
  .wellness-img-box { height:16rem; margin-bottom:2rem; }
  .wellness-title { font-size:1.75rem; margin-bottom:2rem; }
  
}
