.bimg{
--w:100%;
--h:240px;
--bg1:#f2f2f2;
--bg2:#e1e1e1;
--bg3:#ededed;
--line:rgba(0,0,0,.06);
--text-color:rgba(0,0,0,.55);
--text-size:22px;
position:relative;
width:var(--w);
height:var(--h);
overflow:hidden;
border-radius:10px;
background:linear-gradient(130deg,var(--bg1),var(--bg2),var(--bg3),var(--bg1));
background-size:300% 300%;
animation:bimg-bg 7s ease-in-out infinite
}
.bimg img{display:none}
.bimg::before{
content:'';
position:absolute;
inset:-50%;
background:repeating-linear-gradient(135deg,transparent 0,transparent 22px,var(--line) 23px,transparent 26px);
animation:bimg-lines 17s linear infinite
}
.bimg::after{
content:attr(data-text);
position:absolute;
inset:0;
display:flex;
align-items:center;
justify-content:center;
font-family:"Spectral SC",serif;
font-style:italic;
font-weight:400;
font-size:var(--text-size);
background:linear-gradient(180deg,rgba(255,255,255,.85),var(--text-color));
-webkit-background-clip:text;
background-clip:text;
color:transparent;
text-shadow:0 1px 2px rgba(0,0,0,.25),0 0 12px rgba(255,255,255,.15);
animation:bimg-text 7s ease-in-out infinite
}
.bimg:hover,
.bimg:hover::before,
.bimg:hover::after{animation-play-state:paused}
@keyframes bimg-bg{
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@keyframes bimg-lines{
from{transform:translate(0,0)}
to{transform:translate(80px,80px)}
}
@keyframes bimg-text{
0%,100%{transform:translateY(0);opacity:.75}
50%{transform:translateY(-6px);opacity:1}
}

    
    :root {
      --accent: #9474cb;
      --link: #cd8fb3;
      --bg: #fdffff;
      --text: #332f36;
      --box-bg: #fff7fc;
      --box-shadow: 0 4px 24px rgba(148, 116, 203, 0.10);
      --radius: 22px;
      --menu-gap: 2.5rem;
    }
    html, body {
      margin: 0;
      padding: 0;
      background: var(--bg);
      color: var(--text);
      font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
      min-height: 100vh;
    }
    header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 2rem 4vw 1.5rem 4vw;
      background: var(--bg);
      box-shadow: 0 2px 12px rgba(205, 143, 179, 0.06);
    }
    .logo {
      display: flex;
      align-items: center;
      gap: 1rem;
    }
    .logo img {
     height: 222px;
     margin: -30% 0%;
    }
    .logo-title {
      font-size: 1.7rem;
      font-weight: 700;
      color: var(--accent);
      letter-spacing: 2px;
    }
    nav ul {
      display: flex;
      gap: var(--menu-gap);
      list-style: none;
      margin: 0;
      padding: 0;
    }
    nav a {
      text-decoration: none;
      color: var(--link);
      font-weight: 600;
      font-size: 1.1rem;
      transition: color 0.2s;
    }
    nav a:hover {
      color: var(--accent);
      text-decoration: underline;
    }
    main {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 3vw 2vw 5vw 2vw;
      max-width: 900px;
      margin: 0 auto;
    }
    .banner-image {
      width: 100%;
      max-width: 850px;
      height: 210px;
      border-radius: var(--radius);
      object-fit: cover;
      margin-bottom: 2.2em;
      background: #f2eafd;
      box-shadow: 0 6px 32px rgba(205, 143, 179, 0.13);
      display: block;
    }
    h1, h2, h3, h4 {
      color: var(--link);
      margin-top: 0;
      font-weight: 700;
      text-align:center;
    }
    h1 {
      font-size: 2.6rem;
      margin-bottom: 0.2em;
    }
    .intro, .extra-content {
      text-align: center;
      max-width: 850px;
      margin-bottom: 1.7em;
      font-size: 1.22rem;
      line-height: 1.7;
    }
    .extra-content {
      margin-bottom: 2.5em;
    }
    .info-fields {
      display: flex;
      flex-wrap: wrap;
      gap: 2em;
      justify-content: center;
      width: 100%;
      margin-top: 2em;
    }
    .info-box {
      background: var(--box-bg);
      border-radius: var(--radius);
      box-shadow: var(--box-shadow);
      padding: 2.2em 2em 1.7em 2em;
      width: 100%;
      max-width: 340px;
      min-width: 250px;
      transition: box-shadow 0.18s;
      margin-bottom: 1em;
    }
    .info-box:hover {
      box-shadow: 0 8px 36px rgba(148, 116, 203, 0.18);
    }
    .info-box h2 {
      margin-bottom: 0.8em;
      font-size: 1.4em;
      color: var(--accent);
    }
    .info-list, .recent-posts-list {
      list-style: square inside;
      padding-left: 0;
      color: var(--text);
      font-size: 1.05em;
      line-height: 1.6;
    }
    .info-list li a,
    .recent-posts-list li a {
      color: var(--link);
      text-decoration: none;
      transition: color 0.2s;
      font-weight: 500;
    }
    .info-list li a:hover,
    .recent-posts-list li a:hover {
      color: var(--accent);
      text-decoration: underline;
    }
    footer {
      text-align: center;
      margin-top: 4em;
      padding: 2em 0 1.6em 0;
      color: #b0a6bc;
      font-size: 1em;
    }
    @media (max-width: 1020px) {
      .info-fields {
        flex-direction: column;
        align-items: center;
        gap: 1.5em;
      }
      .info-box {
        max-width: 95vw;
      }
      .banner-image {
        height: 130px;
      }
    }
    @media (max-width: 650px) {
      header, main {
        padding-left: 4vw;
        padding-right: 4vw;
      }
      nav ul {
        gap: 1.3rem;
      }
      .logo-title {
        font-size: 1.1rem;
      }
      .banner-image {
        height: 85px;
      }
      .info-box {
        padding: 1.3em 1.1em 1em 1.1em;
      }
    }
    
    .partners-box {
  background: var(--box-bg);
  border-radius: var(--radius);
  box-shadow: var(--box-shadow);
  padding: 2em 2em 1.5em 2em;
  max-width: 860px;
  width: 100%;
  margin-bottom: 1.5em;
  text-align: center;
}
.partners-box h2 {
  color: var(--accent);
  margin-bottom: 1em;
  font-size: 1.4em;
}
.partners-box p {
  color: var(--text);
  font-size: 1.05em;
  margin-bottom: 1.6em;
}
.partners-logos {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 2em;
  margin-bottom: 1em;
}
.partners-logos img {
  height: 64px;
  width: auto;
  object-fit: contain;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 8px rgba(148, 116, 203, 0.09);
  padding: 0.4em 0.7em;
}