/**
* Theme Name: bilder child
* Description: This is a child theme of bilder
* Author: <a href="http://themeforest.net/user/crowdytheme">CrowdyTheme</a>
* Template: bilder
* Version: 1.0.0
*/
.project-single .p-title { font-size: 80px; }

/* =========================
   PROJECTS – GLOBAL SYSTEM
   Scope: doar în single projects
   Necesită: template-ul tău pune wrapper .project-single (single-projects.php)
   ========================= */

.project-single{
  /* --- CONFIG (modifici aici și se schimbă peste tot) --- */
  --p-container: 1120px;

  --p-title-size: 64px;
  --p-subtitle-size: 12px;
  --p-text-size: 15px;
  --p-text-line: 1.8;

  --p-gallery-title-size: 56px;

  --p-section-gap: 110px;   /* distanța standard între secțiuni */
  --p-details-gap: 80px;    /* distanța după imaginea hero */

  --p-col-gap: 48px;        /* gap între coloanele din p-details */
  --p-row-gap: 18px;        /* gap între paragrafe */

  --p-detail-title-size: 14px;
  --p-detail-desc-size: 14px;

  --p-testimonial-text-size: 16px;
  --p-testimonial-name-size: 14px;
  --p-testimonial-occ-size: 12px;

  font-size: var(--p-text-size);
  line-height: var(--p-text-line);
}

/* Container general (doar dacă ai pus clasa p-container undeva) */
.project-single .p-container{
  max-width: var(--p-container);
  margin: 0 auto;
  padding: 0 20px;
}

/* ========== SPACING PE SECTIUNI ========== */
.project-single .p-hero{ margin-bottom: var(--p-section-gap); }
.project-single .p-hero-image{ margin-bottom: var(--p-details-gap); }
.project-single .p-details{ margin-bottom: var(--p-section-gap); }
.project-single .p-gallery{ margin-bottom: var(--p-section-gap); }
.project-single .p-testimonial{ margin-bottom: var(--p-section-gap); }

/* ========== HERO ========== */
.project-single .p-subtitle{
  font-size: var(--p-subtitle-size);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 14px;
  opacity: 0.8;
}

.project-single .p-title{
  font-size: var(--p-title-size);
  line-height: 1.02;
  margin: 0;
}

/* ========== IMAGINE HERO (container) ========== */
.project-single .p-hero-image img{
  width: 100%;
  height: auto;
  display: block;
}

/* ========== TEXT (cele 3 descrieri) ========== */
.project-single .p-text{
  font-size: var(--p-text-size);
  line-height: var(--p-text-line);
  margin: 0 0 var(--p-row-gap);
  max-width: 70ch;
  opacity: 0.85;
}

/* ========== P-DETAILS: 2 COLOANE CONTROLATE GLOBAL (FLEXBOX) ========== */
/* IMPORTANT:
   În Elementor, în interiorul containerului p-details trebuie să existe 2 containere copil:
   - p-details-left
   - p-details-right
*/
.project-single .p-details{
  display: flex;
  gap: var(--p-col-gap);
  align-items: flex-start;
}

.project-single .p-details-left{
  flex: 1.35;
  min-width: 0;
}

.project-single .p-details-right{
  flex: 1;
  min-width: 0;
}

/* ========== DETALII (titlu + descriere) ========== */
.project-single .p-detail-title{
  font-size: var(--p-detail-title-size);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 10px;
}

.project-single .p-detail-desc{
  font-size: var(--p-detail-desc-size);
  line-height: 1.6;
  margin: 0 0 26px;
  opacity: 0.85;
}

/* (OPTIONAL) GRID pentru cele 4 detalii din dreapta
   - Dacă vrei grid automat 2x2, pune clasa p-detail-grid pe containerul care le conține.
   - Dacă NU pui p-detail-grid, această parte nu afectează nimic.
*/
.project-single .p-detail-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px 40px;
}

/* ========== GALERIE ========== */
.project-single .p-gallery-title{
  font-size: var(--p-gallery-title-size);
  line-height: 1.05;
  margin: 0 0 36px;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.project-single .p-gallery img{
  width: 100%;
  height: auto;
  display: block;
}

/* ========== TESTIMONIAL ========== */
.project-single .p-testimonial-desc{
  font-size: var(--p-testimonial-text-size);
  line-height: 1.9;
  margin: 0 0 26px;
  opacity: 0.9;
}

.project-single .p-testimonial-name{
  font-size: var(--p-testimonial-name-size);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0;
}

.project-single .p-testimonial-occupation{
  font-size: var(--p-testimonial-occ-size);
  letter-spacing: 0.10em;
  text-transform: uppercase;
  margin: 6px 0 0;
  opacity: 0.75;
}

/* ========== RESPONSIVE ========== */
@media (max-width: 1024px){
  .project-single{
    --p-title-size: 52px;
    --p-gallery-title-size: 46px;
    --p-section-gap: 80px;
  }
}

@media (max-width: 900px){
  /* p-details devine stacked */
  .project-single .p-details{
    flex-direction: column;
    gap: 34px;
  }

  /* grid detalii -> 1 col */
  .project-single .p-detail-grid{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 767px){
  .project-single{
    --p-title-size: 40px;
    --p-gallery-title-size: 34px;
    --p-section-gap: 60px;
    --p-details-gap: 50px;
  }
}