/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */

.block_newsletter .alert:before {
    left: 10px;
    top: 8px;
}
@font-face {
  font-family: "Buffalo";
  src: url("../fonts/Buffalo-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
/* Icon List -> “pink cards + left bar + icon on the right” */
.wouaf-iconlist-cards{
  --wl-bg: #f7dbe6;          /* card background */
  --wl-accent: #ff008a;      /* left bar + icon */
  --wl-title: #111;          /* first line */
  --wl-muted: #7b6f78;       /* secondary lines */
  --wl-link: #7a6aa8;        /* url line */
}

.wouaf-iconlist-cards .elementor-icon-list-items{
  list-style: none;
  padding: 0;
  margin: 0;
}

.wouaf-iconlist-cards .elementor-icon-list-item{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;

  width: 100%;
  background: var(--wl-bg);
  border-left: 6px solid var(--wl-accent);

  padding: 18px 22px;
  margin: 0 0 18px 0;
  box-sizing: border-box;
}

.wouaf-iconlist-cards .elementor-icon-list-item:last-child{
  margin-bottom: 0;
}

/* move the icon to the right */
.wouaf-iconlist-cards .elementor-icon-list-icon{
  order: 2;
  margin: 2px 0 0 16px;   /* top-right positioning */
  padding: 0;
  line-height: 1;
}

.wouaf-iconlist-cards .elementor-icon-list-icon i{
  color: var(--wl-accent);
  font-size: 18px;
}

/* text block on the left */
.wouaf-iconlist-cards .elementor-icon-list-text{
  order: 1;
  display: block;
  color: var(--wl-muted);
  line-height: 1.35;
}

/* If you use <strong> for the name line */
.wouaf-iconlist-cards .elementor-icon-list-text strong{
  display: block;
  color: var(--wl-title);
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 4px;
}

/* If you use links in the 3rd line */
.wouaf-iconlist-cards .elementor-icon-list-text a{
  color: var(--wl-link);
  text-decoration: none;
  word-break: break-word;
}
.wouaf-iconlist-cards .elementor-icon-list-text a:hover{
  text-decoration: underline;
}


/* Grid */
.wouaf-feature-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:56px;
  padding:24px 0;
}

/* Card */
.wouaf-feature-card{
  background:#fffaf5;
  border:2px solid #ff009d;
  border-radius:26px;
  padding:46px 56px 44px;
  box-sizing:border-box;
}

/* Gradient pill */
.wouaf-feature-pill{
  width:min(320px,75%);
  height:92px;
  margin:0 auto 22px;
  border-radius:999px;
  background:linear-gradient(180deg,#b1cce2 0%, #ff009d 100%);
  display:flex;
  align-items:center;
  justify-content:center;
}

.wouaf-feature-pill img{
  display:block;
  height:52px;
  width:auto;
}

/* Title */
.wouaf-feature-title{
  margin:0 0 16px;
  text-align:center;
  color:#ff009d;
  font-weight:700;
  font-size:30px;
  line-height:1.1;
  letter-spacing:0.2px;
  /* optional: if you have a playful font available */
  /* font-family:"Baloo 2", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; */
}

/* Text */
.wouaf-feature-text{
  color:#86828c;
  font-size:15.5px;
  line-height:1.65;
}

.wouaf-feature-text p{ margin:0 0 12px; }

.wouaf-feature-text ul{
  margin:10px 0 0;
  padding-left:18px;
  list-style:inside;
}

.wouaf-feature-text li{ margin:8px 0; }

/* Responsive: stack cards */
@media (max-width: 991px){
  .wouaf-feature-grid{ grid-template-columns:1fr; gap:28px; }
  .wouaf-feature-card{ padding:34px 22px; }
  .wouaf-feature-title{ font-size:26px; }
}

/* Optional animations (like Elementor fadeInUp/fadeInDown) */
@keyframes wouafUp { from {opacity:0; transform:translateY(18px);} to {opacity:1; transform:none;} }
@keyframes wouafDown { from {opacity:0; transform:translateY(-18px);} to {opacity:1; transform:none;} }

.wouaf-anim-up{ animation:wouafUp .7s ease both; }
.wouaf-anim-down{ animation:wouafDown .7s ease both; }



/* 2 cards side-by-side like the screenshot */
.wouaf-services-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:40px;
}

/* Outer rounded light-grey card */
.wouaf-service-card{
  background:#f4f6fb;
  border-radius:28px;
  padding:18px;
  display:flex;
  gap:18px;
  align-items:stretch;
  box-sizing:border-box;
}

/* Photo block */
.wouaf-service-media{
  flex:0 0 42%;
  border-radius:22px;
  overflow:hidden;
  min-height:320px; /* controls the card height */
}

.wouaf-service-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* White content panel */
.wouaf-service-body{
  flex:1;
  background:#fff;
  border-radius:22px;
  padding:34px 34px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  box-sizing:border-box;
}

.wouaf-service-body h3{
  margin:0 0 14px;
  color:#ff009d;
  font-weight:700;
  font-size:22px;
  line-height:1.2;
}

.wouaf-service-body p{
  margin:0 0 12px;
  color:#8a8791;
  line-height:1.65;
}

.wouaf-service-body ul{
  margin:10px 0 0;
  padding-left:18px;
  color:#8a8791;
  list-style: inside;
}

.wouaf-service-body li{ margin:8px 0; }

/* Responsive: stack */
@media (max-width: 991px){
  .wouaf-services-grid{ grid-template-columns:1fr; }
  .wouaf-service-card{ flex-direction:column; }
  .wouaf-service-media{ flex:0 0 auto; min-height:220px; }
  .wouaf-service-body{ padding:22px; }
}



/* Desktop/tablet: keep it reasonable too (optional) */
.header_logo img.logo{
  height: auto;
  max-height: 90px;      /* adjust */
  width: auto;
}

/* Mobile */
@media (max-width: 767px){
  .header_logo img.logo{
    max-height: 52px;    /* main control: reduce logo height */
    max-width: 70vw;     /* prevent it from spanning the whole screen */
    width: auto;
    height: auto;
  }
}
