/* Responsive full-width card layout */
.fullwidth-cards {
    background-color: red;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--wp--preset--spacing--20, 20px);
  width: 100%;
  margin: 0;
  padding-inline: var(--wp--preset--spacing--20, 20px);
  box-sizing: border-box;
}

/* Individual card styling */
.fullwidth-cards > * {
  border: 1px solid #ddd;
  border-radius: 15px;
  background: #fff;
  padding: var(--wp--preset--spacing--20, 20px);
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transition: transform 0.3s ease;
}

/* Nice hover effect (optional) */
.fullwidth-cards > *:hover {
  transform: translateY(-4px);
}

/* Make images responsive */
.fullwidth-cards img {
  width: 200px;           
  height: 200px;          
  object-fit: cover;      
  display: block;         
  margin: 0 auto; 
}

/* Prevent overflow on very small screens */
.fullwidth-cards, .fullwidth-cards > * {
  min-width: 0;
}



/* ROW: horizontal scroll, hidden scrollbar, padding, no shrink */
.categories{
  display:flex;
  flex-wrap:nowrap;
  padding-left: 100px;
  gap: var(--wp--preset--spacing--20);
  padding-left: var(--wp--preset--spacing--40);
  padding-right: var(--wp--preset--spacing--40);

  overflow-x:auto;               /* horizontal scroll */
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
  scroll-snap-type:x proximity;  
  scrollbar-width:none;          /* Firefox hide */
  -ms-overflow-style:none;       /* old Edge/IE hide */
}
.categories::-webkit-scrollbar{  /* Chrome/Safari/Edge hide */
  width:0;height:0;display:none;
}
a{
  text-decoration: none !important;
}
/* CARD: keep original size; stick to one row; snap */
.categories > .wp-block-group{
  flex:0 0 auto;                 /* 👈 prevents resizing/shrinking */
  scroll-snap-align:start;
}

/* Arch tile + hover polish (optional) */
.categories > .wp-block-group > .has-background{
  border-radius:50px 50px 18px 18px;
}
.categories > .wp-block-group{
  transition:transform .3s ease, box-shadow .3s ease;
}
.categories > .wp-block-group:hover,
.categories > .wp-block-group:hover a {
  transform: translateY(-4px) scale(1.04);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
  color: black;
}



/* Container for the infinite marquee */
.wp-block-group.categories {
  display: flex;
  flex-wrap: nowrap;       /* keep items in one row */
  overflow-x: hidden;      /* hide scrollbar; JS scrolls it */
  gap: var(--wp--preset--spacing--20);
  scroll-behavior: auto;   /* JS handles movement, not native smooth */
}

/* Optional: keep each category card from shrinking */
.wp-block-group.categories > .wp-block-group {
  flex: 0 0 auto;
}





/* Hero section */
/* ====== Banner base style ====== */
.banner-cover {
  position: relative;
  overflow: hidden;
  border-radius: 30px;
  animation: fadeIn 1s ease-in-out;
}

/* subtle fade-in when banner loads */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ====== Animated floating images (if you add small decorative shapes later) ====== */
.banner-cover img {
  transition: transform 0.8s ease;
}

.banner-cover:hover img.wp-block-cover__image-background {
  transform: scale(1.1);
}

/* optional floating animation for banner-right-img */
.banner-right-img img {
  animation: floatUpDown 2s ease-in-out infinite;
}
@keyframes floatUpDown {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

/* ====== Text animation ====== */
.banner-title {
  animation: fadeSlideIn 1s ease forwards;
  color: rgba(245, 245, 245, 1);
  opacity: 0;
}
@keyframes fadeSlideIn {
  0% { opacity: 0; transform: translateY(25px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Paragraph fade-in slightly after title */
.banner-left p {
  opacity: 0;
  animation: fadeInText 1.2s ease forwards;
  animation-delay: 0.4s;
}
@keyframes fadeInText {
  from { opacity: 0; transform: translateY(15px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ====== Button hover effects ====== */
.banner-btn .btn-text a {
  position: relative;
  overflow: hidden;
  transition: background 0.4s ease, color 0.4s ease, transform 0.3s ease;
}

.banner-btn .btn-text a:hover {
  transform: translateY(-3px);
  border: 2px solid black !important;
  font-weight:700;
  color: #012458 !important;
  background-color: white !important; /* darker shade of your primary */
  /* box-shadow: 0 8px 15px rgba(0,0,0,0.2); */
}

.banner-btn .btn-icon a {
  background-color: whitesmoke;
  transition: all 0.4s ease;
}

.banner-btn .btn-icon a:hover {
  transform: rotate(360deg) scale(1);
  background-color: whitesmoke !important;
  border: 2px solid black;
}


.practice-box:hover{
  background-color: #426baa !important;
  color: wheat !important;
}

.practice-box:hover p {
  color: wheat !important;
}

.practice-box:hover a{
  color: white;
}

.practice-img img{
  background-color: #222e3f;
  border-radius: 50%;
  padding: 5px;
  margin-top: -40px !important;
  transition: transform 1.3s ease-in-out;
}



.practice-box:hover img {
  transform: rotate(360deg);
  background-color: rgba(255, 255, 255, 0.664);
}


/* Product card style... */
.kfs-product-card {
    transition: transform .25s ease, box-shadow .25s ease;
}

/* Card hover effect */
.kfs-product-card:hover {
    transform: translateY(-6px);
    box-shadow: 5px 14px 28px rgba(44, 62, 80, 0.7) !important;
}

/* Button hover (when hovering inside the card) */
.kfs-product-card:hover .wp-element-button {
    background-color: whitesmoke !important;
    border: 1px solid black;
    color: #012458;
    font-weight: 700;
}



/* FAQ */
/* Smooth hover zoom on the entire cover */
.faq-left-bg {
    transition: transform .35s ease, box-shadow .35s ease;
    overflow: hidden;
}

.faq-left-bg:hover {
    transform: scale(1.02);
    box-shadow: 0 20px 40px rgba(0,0,0,0.25);
}

/* Darken overlay slightly on hover */
.faq-left-bg:hover .wp-block-cover__background {
    opacity: 0.85;
    transition: opacity .25s ease;
}

.faq-left-bg:hover .wp-element-button{
  background-color: white !important;
}

/* Text brightness increase */
.faq-left-bg:hover .faq-info-box p,
.faq-left-bg:hover .faq-info-box strong,
.faq-left-bg:hover .faq-info-box a,
.faq-left-bg:hover .faq-info-box i 
{
    color: black !important;
    transition: color .3s ease;
}




a:not(.wp-element-button):not(.wp-block-button__link):not(.button):not(.wc-forward):not(.added_to_cart) {
    color: #012458; /* your dark navy */
}

.header_part a{
  color: inherit !important;
}

/* 2. Don't apply the global color inside footer wrapper */
.lfs-footer-outer a {
    color: inherit !important;
}



/* Limit post title lines manage */
.wp-block-post-title a {
    display: -webkit-box;
    -webkit-line-clamp: 3; 
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}