:root{
    --bg:#f4f3ee;
    --cream:#ffffff;
    --green:#8DBB8D;
    --blue:#526FAE;
    --red:#B10C2A;
    --dark:#30303A;
    --grey:#676061;
    --line:rgba(48,48,58,.12);
  }

  .vitrier-page{
    background:var(--bg);
    color:var(--dark);
  }

  .hero-vitrier{
    position:relative;
    min-height:430px;
    display:flex;
    align-items:center;
    background:
      linear-gradient(90deg, rgba(48,48,58,.78) 0%, rgba(48,48,58,.52) 46%, rgba(48,48,58,.18) 100%),
      url('/assets/images/charleroi0.webp');
    background-size:cover;
    background-position:center;
    overflow:hidden;
  }

  .hero-vitrier:after{
    content:"";
    position:absolute;
    inset:auto 0 0 0;
    height:80px;
    background:linear-gradient(180deg, transparent, var(--bg));
  }

  .hero-box{
    position:relative;
    z-index:2;
    max-width:680px;
    padding:115px 0 85px;
  }

  .hero-tag{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    padding:.45rem .85rem;
    background:rgba(255,255,255,.92);
    color:var(--red);
    font-size:.84rem;
    font-weight:800;
    margin-bottom:16px;
    border-radius:0;
  }

  .hero-box :is(h1, h2.h1){
    color:#fff;
    font-size:clamp(2rem, 3.8vw, 3.15rem);
    line-height:1.08;
    font-weight:850;
    letter-spacing:-.8px;
    margin-bottom:16px;
  }

  .hero-box p{
    color:rgba(255,255,255,.88);
    font-size:1.03rem;
    line-height:1.75;
    max-width:630px;
    margin-bottom:24px;
  }

  .hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }

  .btn-primary-v,
  .btn-secondary-v{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.55rem;
    border-radius:0;
    padding:.78rem 1.15rem;
    font-weight:800;
    text-decoration:none;
    transition:.2s ease;
  }

  .btn-primary-v{
    background:var(--red);
    color:#fff;
    border:1px solid var(--red);
    box-shadow:0 12px 28px rgba(177,12,42,.22);
  }

  .btn-secondary-v{
    background:rgba(255,255,255,.13);
    color:#fff;
    border:1px solid rgba(255,255,255,.28);
    backdrop-filter:blur(8px);
  }

  .btn-primary-v:hover,
  .btn-secondary-v:hover{
    color:#fff;
    transform:translateY(-1px);
  }

  .intro-card{
    margin-top:-34px;
    position:relative;
    z-index:4;
    background:#fff;
    border:1px solid var(--line);
    border-radius:0;
    padding:26px;
    box-shadow:0 18px 45px rgba(48,48,58,.08);
  }

  .intro-card h2,
  .section-title{
    color:var(--dark);
    font-size:1.65rem;
    line-height:1.25;
    font-weight:850;
    letter-spacing:-.4px;
    margin-bottom:12px;
  }

  .intro-card p,
  .content-box p,
  .seo-content p{
    color:var(--grey);
    line-height:1.85;
    font-size:1rem;
  }

  .services-line{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:14px;
    margin-top:22px;
  }

  .service-item{
    background:#f8f8f4;
    border:1px solid var(--line);
    border-radius:0;
    padding:18px;
  }

  .service-item i{
    color:var(--red);
    font-size:1.15rem;
    margin-bottom:12px;
  }

  .service-item h3{
    font-size:1.05rem;
    font-weight:850;
    color:var(--dark);
    margin-bottom:8px;
  }

  .service-item p{
    font-size:.94rem;
    line-height:1.7;
    margin:0;
  }

  .content-section{
    padding:38px 0 0;
  }

  .content-box{
    background:#fff;
    border:1px solid var(--line);
    border-radius:0;
    overflow:hidden;
    box-shadow:0 16px 38px rgba(48,48,58,.06);
  }

  .content-box .text{
    padding:30px;
  }

  .content-box h2{
    color:var(--dark);
    font-size:1.55rem;
    font-weight:850;
    letter-spacing:-.35px;
    margin-bottom:14px;
  }

  .content-box .photo{
    height:100%;
    min-height:300px;
    background-size:cover;
    background-position:center;
  }

  .note-box{
    margin-top:18px;
    padding:16px 18px;
    background:rgba(141,187,141,.18);
    border:1px solid rgba(141,187,141,.38);
    color:var(--dark);
    line-height:1.7;
    border-radius:0;
  }

  .image-row{
    padding:38px 0 0;
  }

  .image-card{
    border-radius:0;
    overflow:hidden;
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 14px 34px rgba(48,48,58,.06);
  }

  .image-card img{
    width:100%;
    height:230px;
    object-fit:cover;
    display:block;
  }

  .image-card div{
    padding:15px 17px;
    color:var(--grey);
    font-size:.95rem;
    line-height:1.6;
  }

  .image-card strong{
    display:block;
    color:var(--dark);
    font-size:1rem;
    margin-bottom:4px;
  }

  .seo-content{
    margin-top:38px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:0;
    padding:34px;
    box-shadow:0 16px 38px rgba(48,48,58,.06);
  }

  .seo-content :is(h1, h2.h1){
    color:var(--dark);
    font-size:1.8rem;
    font-weight:850;
    letter-spacing:-.45px;
    line-height:1.25;
    margin-bottom:18px;
  }

  .seo-content h2{
    color:var(--dark);
    font-size:1.35rem;
    font-weight:850;
    margin-top:28px;
    margin-bottom:12px;
    padding-left:14px;
    border-left:4px solid var(--red);
  }

  .cta-simple{
    margin:38px 0 50px;
    background:var(--dark);
    border-radius:0;
    padding:28px;
    color:#fff;
  }

  .cta-simple h2{
    font-size:1.45rem;
    font-weight:850;
    margin-bottom:8px;
  }

  .cta-simple p{
    color:rgba(255,255,255,.75);
    line-height:1.75;
    margin:0;
  }

  @media(max-width:991px){
    .hero-vitrier{min-height:auto;}
    .hero-box{padding:105px 0 70px;}
    .services-line{grid-template-columns:1fr;}
    .content-box .photo{min-height:250px;}
    .seo-content{padding:24px;}
  }