:root{
    --bg:#1d2327;
    --accent:#27e0ce;
    --panel:#2a2e33;
    --text:rgba(255,255,255,.92);
    --muted:rgba(255,255,255,.72);
  }

  .wp-hero{
    position:relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    min-height:clamp(520px, 78vh, 860px);
    background:var(--bg);
    overflow:hidden;
    isolation:isolate;
  }

  .wp-hero__video{
    position:absolute; inset:0;
    width:100%; height:100%;
    object-fit:cover;
    filter:saturate(1.05) contrast(1.05);
    transform:scale(1.03); /* легкий зум щоб не було чорних країв */
  }

  .wp-hero__overlay{
    position:absolute; inset:0;
    background:
      radial-gradient(900px 520px at 20% 30%, rgba(39,224,206,.20), transparent 60%),
      radial-gradient(800px 520px at 85% 70%, rgba(39,224,206,.12), transparent 55%),
      linear-gradient(180deg, rgba(29,35,39,.80), rgba(29,35,39,.92));
    z-index:1;
  }

  .wp-hero__container {
    position:relative;
    z-index:2;
    height:100%;
    max-width:1180px;
    padding:clamp(28px, 5vw, 64px);
    display:flex;
    align-items:center;
  }

  .wp-hero__content{
    max-width:820px;
    padding:clamp(16px, 2vw, 24px);
    border:1px solid rgba(39,224,206,.22);
    background:linear-gradient(180deg, rgba(42,46,51,.50), rgba(42,46,51,.24));
    border-radius:18px;
    box-shadow:0 18px 60px rgba(0,0,0,.35);
    backdrop-filter: blur(6px);
  }

  .wp-hero__badge{
    display:inline-flex;
    gap:.5rem;
    align-items:center;
    padding:.45rem .75rem;
    border-radius:999px;
    background:rgba(39,224,206,.12);
    border:1px solid rgba(39,224,206,.32);
    color:var(--text);
    font-size:.92rem;
    letter-spacing:.2px;
    margin-bottom:14px;
  }

  .wp-hero__title{
    color:var(--text);
    font-weight:800;
    line-height:1.05;
    margin:0 0 0.875rem;
    font-size:clamp(30px, 3.3vw, 54px) !important;
    text-shadow:0 10px 30px rgba(0,0,0,.35);
  }

  .wp-hero__subtitle{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    align-items: center;
    margin:0 0 22px;
    color:var(--muted);
    font-size:clamp(16px, 1.35vw, 20px);
    line-height:1.55;
  }
   
  .wp-hero__subtitleLabel{
    color:rgba(255,255,255,.86);
    font-weight:600;
  }

  .wp-hero__typewrap{
    display:inline-flex;
    align-items:center;
    gap:6px;
    margin-left:8px;
    padding:.2rem .5rem;
    border-radius:10px;
    background:rgba(29,35,39,.45);
    border:1px solid rgba(39,224,206,.22);
  }
  .wp-hero__type{
    color:rgba(255,255,255,.92);
    font-weight:600;
  }
  .wp-hero__caret{
    color:var(--accent);
    font-weight:700;
    animation:wpHeroBlink 1s steps(1) infinite;
  }
  @keyframes wpHeroBlink { 50% { opacity:0; } }

  .wp-hero__actions{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:6px;
  }
  .wp-hero__btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:12px 16px;
    border-radius:14px;
    text-decoration:none;
    font-weight:700;
    letter-spacing:.2px;
    border:1px solid transparent;
    transition:transform .15s ease, background .15s ease, border-color .15s ease, opacity .15s ease;
    user-select:none;
  }
  .wp-hero__btn:hover{ transform:translateY(-1px); }
  .wp-hero__btn--primary{
    background:var(--accent);
    color:#0c1b1a;
    border-color:rgba(39,224,206,.55);
  }
  .wp-hero__btn--primary:hover{ opacity:.95; background:rgba(39,224,206,.26); color:white;}
  .wp-hero__btn--ghost{
    background:rgba(29,35,39,.35);
    color:var(--text);
    border-color:rgba(39,224,206,.26);
  }
  .wp-hero__btn--ghost:hover{ opacity:.95; background:white; color:black;}

  .wp-hero__meta{
    margin-top:16px;
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
    color:rgba(255,255,255,.72);
    font-size:.95rem;
  }
  .wp-hero__meta a{
    color:rgba(255,255,255,.82);
    text-decoration:none;
    border-bottom:1px solid rgba(39,224,206,.25);
  }
  .wp-hero__meta a:hover{ border-bottom-color:rgba(39,224,206,.65); color:white;}
  .wp-hero__dot{ opacity:.6; }

 @media (max-width: 768px) {
    .wp-hero__container {
        padding: 0;
    }
    .wp-hero__title{
       font-size: 1.375rem !important; 
    }
  }
  @media (max-width: 576px) {
    .wp-hero__subtitle{
        flex-direction: column;
        align-items: flex-start;
    }
    .wp-hero__typewrap{
        margin-left:0;
    }
    .wp-hero__subtitle{
        font-size: 0.75rem;
    }
    .wp-hero__btn {
        font-size: 0.875rem;
        padding: 0.5rem 1rem;
        border-radius:0.5rem;
    }
  }
  /* Mobile: менше "скла" */
  @media (max-width: 640px){
    .wp-hero__content{ backdrop-filter:none; }
  }

  /* Reduce motion */
  @media (prefers-reduced-motion: reduce){
    .wp-hero__caret{ animation:none; }
    .wp-hero__btn{ transition:none; }
    .wp-hero__btn:hover{ transform:none; }
  }

  /* Мої послуги  */

   :root{
    --bg:#1d2327;
    --panel:#2a2e33;
    --accent:#27e0ce;

    --text:rgba(255,255,255,.92);
    --muted:rgba(255,255,255,.74);
    --line:rgba(39,224,206,.22);
  }


  .home-services-cta__inner{
/*     background:
      radial-gradient(900px 520px at 15% 25%, rgba(39,224,206,.14), transparent 60%),
      radial-gradient(900px 520px at 85% 75%, rgba(39,224,206,.10), transparent 60%),
      linear-gradient(180deg, rgba(42,46,51,.70), rgba(42,46,51,.34)); */
      background: 
      radial-gradient(900px 520px at 15% 25%, rgba(39, 224, 206, .14), transparent 60%), 
      radial-gradient(900px 520px at 85% 75%, rgba(39, 224, 206, .10), transparent 60%), 
      linear-gradient(180deg, rgba(42, 46, 51, .70), rgb(88 18 18 / 34%));
    box-shadow:0 18px 60px rgba(0,0,0,.35);
    display:grid;
    grid-template-columns: 1.15fr .85fr;
    gap:18px;
    overflow:hidden;
    position:relative;
    isolation:isolate;
  }

  /* subtle decorative line */
  .home-services-cta__inner::after{
    content:"";
    position:absolute;
    inset:auto -20% 0 -20%;
    height:2px;
    background:linear-gradient(90deg, transparent, rgba(39,224,206,.55), transparent);
    opacity:.6;
  }
  .home-services-cta__text{
    margin:0;
    color:var(--muted);
    font-size:clamp(15px, 1.15vw, 18px);
    line-height:1.7;
    max-width:58ch;
  }

  .home-services-cta__actions{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:16px;
  }

  .home-services-cta__btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:12px 16px;
    border-radius:14px;
    text-decoration:none;
    font-weight:780;
    letter-spacing:.2px;
    border:1px solid transparent;
    transition:transform .15s ease, opacity .15s ease, border-color .15s ease, background .15s ease;
    user-select:none;
    white-space:nowrap;
  }
  .home-services-cta__btn:hover{ transform:translateY(-1px); }

  .home-services-cta__btn--primary{
    background:var(--accent);
    color:#0c1b1a;
    border-color:rgba(39,224,206,.55);
  }
  .home-services-cta__btn--primary:hover{ opacity:.95; color:#0c1b1a; }

  .home-services-cta__btn--ghost{
    background:rgba(29,35,39,.30);
    color:var(--text);
    border-color:rgba(39,224,206,.26);
  }

  .home-services-cta__chips{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:14px;
  }
  .home-services-cta__chip{
    padding:.42rem .7rem;
    border-radius:999px;
    background:rgba(29,35,39,.35);
    border:1px solid var(--line);
    color:rgba(255,255,255,.84);
    font-size:.92rem;
  }

  .home-services-cta__right{
    display:grid;
    gap:12px;
    align-content:start;
  }

  .home-services-cta__card{
    text-decoration:none;
    color:var(--text);
    border-radius:16px;
    border:1px solid var(--line);
    background:linear-gradient(180deg, rgba(29,35,39,.40), rgba(29,35,39,.18));
    padding:14px;
    transition:transform .15s ease, border-color .15s ease, background .15s ease;
    box-shadow:0 12px 34px rgba(0,0,0,.26);
  }
  .home-services-cta__card:hover{
    transform:translateY(-2px);
    border-color:rgba(39,224,206,.45);
    background:linear-gradient(180deg, rgba(29,35,39,.55), rgba(29,35,39,.22));
  }

  .home-services-cta__cardTop{
    display:flex;
    gap:10px;
    align-items:center;
    margin-bottom:8px;
  }

  .home-services-cta__icon{
    width:36px; height:36px;
    display:grid; place-items:center;
    border-radius:12px;
    background:rgba(39,224,206,.12);
    border:1px solid rgba(39,224,206,.26);
    font-size:18px;
    flex:0 0 auto;
  }

  .home-services-cta__card p{
    margin:0;
    color:rgba(255,255,255,.74);
    line-height:1.6;
  }

  @media (max-width: 980px){
    .home-services-cta__inner{ grid-template-columns: 1fr; }
  }

  @media (prefers-reduced-motion: reduce){
    .home-services-cta__btn,
    .home-services-cta__card{ transition:none; }
    .home-services-cta__btn:hover,
    .home-services-cta__card:hover{ transform:none; }
  }
