/* Phoenicia — estilos de la pagina «faq» */
/* ---------- INTRO ---------- */
  /* .intro vive en base.css */

  
/* ---------- CTA ---------- */
  .cta{ background: var(--white); padding:90px 0; }
  .cta .container{
    display:grid; grid-template-columns: 1.1fr 0.9fr; gap:50px; align-items:center;
  }
  .cta h2{ font-size:clamp(1.43rem, 5.4vw, 2.3rem); margin-bottom:18px; }
  .cta p{ color: var(--charcoal); margin-bottom:30px; max-width:440px; }
  .cta-media{ position:relative; padding:0 16px 22px 0; }
  .cta-media .accent-diagonal{
    position:absolute; width:150px; height:150px; top:-16px; right:-16px;
    background: linear-gradient(135deg, var(--blush), var(--gold));
    opacity:0.75; transform: rotate(8deg); border-radius:20px; z-index:0;
  }
  .cta-media .img-placeholder{
    position:relative; z-index:1; min-height:300px;
    border:2px dashed var(--gold); background: rgba(183,150,125,0.07); border-radius:6px;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center; color: var(--gold-texto); font-size:0.85rem; font-weight:500; gap:8px;
  }
  .cta-media .img-placeholder span.icon{ font-size:clamp(1.35rem, 3.8vw, 1.6rem); }
  .cta-img{
    position:relative; z-index:1; width:100%; height:300px;
    object-fit:cover; border-radius:6px; display:block;
  }

  @media (max-width:900px){ .cta .container{ grid-template-columns:1fr; } }

  
/* ---------- CATEGORÍA FAQ ---------- */
  .faq-category{ padding:60px 0; }
  .faq-category:nth-of-type(odd){ background: var(--white); }
  .faq-category:nth-of-type(even){ background: var(--bg-soft); }
  .faq-category-head{ margin-bottom:32px; }
  .faq-category-head h2{ font-size:clamp(1.35rem, 4.5vw, 1.9rem); }

  .faq-list{ max-width:880px; }
  .faq-item{
    border-bottom:1px solid var(--border-soft);
  }
  .faq-item:first-child{ border-top:1px solid var(--border-soft); }
  .faq-question{
    display:flex; align-items:center; justify-content:space-between; gap:20px;
    padding:20px 4px; cursor:pointer; user-select:none;
    list-style:none;
  }
  .faq-question::-webkit-details-marker{ display:none; }
  .faq-question::marker{ content:''; }
  .faq-question:focus-visible{
    outline:3px solid var(--navy-heading); outline-offset:2px; border-radius:4px;
  }
  .faq-question h3{
    font-family:var(--fuente-cuerpo); font-size-adjust: var(--aspecto-cuerpo); font-weight:600; font-size:0.99rem;
    color: var(--navy-heading); margin:0;
  }
  .faq-question .plus{
    flex-shrink:0; width:26px; height:26px; border-radius:50%;
    background: var(--bg-soft); color: var(--gold-texto); border:1px solid var(--border-soft);
    display:flex; align-items:center; justify-content:center;
    font-size:1rem; font-weight:600; transition: transform .25s ease, background .25s ease;
  }
  .faq-item[open] .faq-question .plus{ transform: rotate(45deg); background: var(--gold-texto); color: var(--white); border-color: var(--gold-texto); }

  /* El estado abierto/cerrado lo controla <details>, no una altura maxima:
     asi el contenido es accesible por teclado y buscable por el navegador. */
  .faq-answer{
    padding-top:2px;
    animation: faq-abre .22s ease both;
  }
  @keyframes faq-abre{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }
  @media (prefers-reduced-motion: reduce){
    .faq-answer{ animation:none; }
    .faq-question .plus{ transition:none; }
  }
  .faq-answer p{
    font-size:0.93rem; color: var(--charcoal); padding:0 4px 22px 4px; max-width:760px;
  }
  .faq-answer ul{ padding:0 4px 22px 24px; }
  .faq-answer li{ font-size:0.93rem; color: var(--charcoal); margin-bottom:6px; }

  @media (max-width:700px){ .cat-nav{ position:static; } }