/* Colores de marca */
:root {
    --ppf-accent: #E95C27;
  }
  
  /* Botonera */
  .PPF-ppf-quality-button .btn {
    border: 2px solid var(--ppf-accent);
    background: transparent;
    color: #fff;
    font-weight: 700;
    letter-spacing: .02em;
    z-index: 4;
  }
  
  .PPF-ppf-quality-button .btn:hover {
    opacity: .9;
  }
  
  .PPF-ppf-quality-button .btn.active,
  .PPF-ppf-quality-button .btn:focus,
  .PPF-ppf-quality-button .btn[aria-pressed="true"] {
    background: #000;                 /* #negro activo */
    color: #fff;
    border-color: var(--ppf-accent);  /* mantiene el borde */
    box-shadow: 0 0 0 0.2rem rgba(233,92,39,.2);
  }
  
  /* Contenido dinámico */
  .ppf-quality-container{
    display:flex; 
    flex-direction: column;
     place-items: center;
     align-items: center;
      
  }
  .PPF-dinamic-content{
    display:grid; 
    grid-template-rows:auto auto auto;
     row-gap:.75rem;
    width: min(77vw, 900px);
    color:#fff;
     background:transparent;
    border:2px solid var(--ppf-accent);
     border-radius:16px;
    
    
  }
  
  /* Texto arriba izq */
  .PPF-DNMC-TXT h1 {
    font-weight: 700;
    margin: 0;
  }
  .PPF-DNMC-TXT p {
    opacity: .9;
  }
  .ratio-17x6 { 
    --bs-aspect-ratio: calc(2 / 17 * 100%);
 }
  /* Imagen centrada, sin reflow al cambiar */
  .PPF-DNMC-IMG-FRAME{
    position: relative;
    width: 100%;
    display: grid; place-items: center;
    
  }
  
  .PPF-DNMC-IMG{
    width: 100%;
    height: auto !important;
    translate: 0% -34%;
  }
  
  /* Botones inferiores */
  .btn-call-now-v2 {
    background: #000;
    color: #fff;
    border: 2px solid var(--ppf-accent);
    font-weight: 700;
    border-radius: 10px;
  }
  .btn-call-now-v2:hover { opacity: .9; }
  
  .btn-get-quote-services {
    background: transparent;
    color: #fff;
    border: 2px solid var(--ppf-accent);
    font-weight: 700;
  }
  .btn-get-quote-services:hover { background: rgba(233,92,39,.1); }
  
  /* Accesibilidad focus */
  .PPF-dinamic-content :is(button,a):focus-visible {
    outline: 3px solid rgba(233,92,39,.6);
    outline-offset: 2px;
  }
  
  /* Responsivo leve */
  @media (max-width: 576px) {
    .PPF-ppf-quality-button .btn { font-size: .9rem; padding: .5rem .6rem; }
    .PPF-DNMC-TXT h1 { font-size: 1.3rem; }
  }
  
 .ppf-buttons-wrap{
    translate: 0% 480% !important;
  }
  
  @media (max-width: 576px) {
    .ppf-buttons-wrap{
    translate: 0% 204% !important;
    }
  }
  @media (min-width:1200px) {
    .ppf-buttons-wrap{
    translate: 0% 680% !important;
    }
  }