/* ===== About (light) ===== */
.about--light { background:#fff; color:#000; }
.about { min-height:100svh; display:block; }

/* Container grid: 2 coloane pe desktop/tabletă */
.about-grid{
  width:min(1600px, 94vw);
  margin:0 auto;
  min-height:100svh;
  display:grid;
  grid-template-columns: clamp(72px, 18vw, 180px) minmax(0, 1fr);
  column-gap: clamp(12px, 3vw, 56px);
  padding:
    calc(var(--navH,64px) + clamp(20px, 6vw, 72px))
    0
    clamp(32px, 6vw, 96px);
}

/* Stânga */
.about-left{
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  min-width:0;
}
.about-tag{
  font-size: clamp(10px, 2.6vw, 16px);
  letter-spacing:.08em;
  font-weight:700;
  opacity:.9;
  line-height:1.1;
}

/* Dreapta (headline) – TOTUL la marginea dreaptă */
.about-right{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  text-align:right;
  min-width:0;
}

/* Headline – rânduri fără wrap, aliniate la dreapta */
.about-headline{
  margin:0;
  display:grid;
  gap: clamp(6px, 1.6vw, 16px);
  line-height:.95;
  width:100%;
}
.about-headline .row{
  display:inline-flex;
  align-items:baseline;
  justify-content:flex-end;
  gap: clamp(8px, 1.6vw, 22px);
  white-space: nowrap;   /* nu rupe cuvintele */
  width:100%;
  text-align:right;
  min-width:0;
}
.about-headline .s{
  font-family:"Inter", system-ui, sans-serif;
  font-weight:900;
  letter-spacing:-.02em;
  font-size: clamp(18px, 7vw, 100px);
}
.about-headline .r{
  font-family:"Playfair Display", Georgia, serif;
  font-weight:800;
  letter-spacing:-.02em;
  font-size: clamp(20px, 7.6vw, 110px);
}

/* Nota lângă HISTORICAL */
.row-historical .note{
  display:inline-flex;
  align-items:baseline;
  gap:6px;
  font-weight:700;
  letter-spacing:.02em;
  opacity:.85;
  font-size: clamp(10px, 2.4vw, 16px);
}
.row-historical .note .asterisk{
  font-family:"Playfair Display", Georgia, serif;
  font-weight:800;
  font-size: clamp(14px, 2.5vw, 22px);
}

/* ===== Descriere (sub headline) =====
   – întinsă pe toată grila, dar cu padding lateral ca să NU fie lipită de margini */
.about-desc{
  grid-column: 1 / -1;
  justify-self: start;
  max-width: 720px;
  margin-top: clamp(28px, 5vw, 56px);
  padding-inline: clamp(16px, 2.5vw, 24px); /* ⟵ spațiu stânga/dreapta */
  text-align: left;
}
.about-desc p{
  font-family: "Inter", system-ui, sans-serif;
  font-weight: 300;
  font-size: clamp(14px, 1.2vw, 18px);
  line-height: 1.6;
  color: #000;
}

/* ===== Buton (centrat + „lichid”) ===== */
.about-btn-wrap{
  grid-column: 1 / -1;              /* ⟵ pe toată grila */
  display:flex;
  justify-content:center;           /* ⟵ pe centru */
  margin-top: clamp(28px, 6vw, 56px);
  padding-inline: clamp(16px, 2.5vw, 24px); /* aliniat cu descrierea */
}
.about-btn{
  position: relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width: clamp(120px, 18vw, 180px);
  height: clamp(120px, 18vw, 180px);
  border: 2px solid #000;
  border-radius: 50%;
  background: transparent;
  color:#000;
  text-decoration:none;
  overflow:hidden;                   /* fill-ul rămâne în cerc */
  transition: color .35s ease;
  cursor:pointer;
}
.about-btn::after{
  content:"";
  position:absolute;
  inset:0;
  background:#000;
  border-radius:50%;
  transform: translateY(100%);       /* pornește sub cerc */
  transform-origin: bottom center;   /* umplere de jos în sus */
  transition: transform .55s cubic-bezier(.22,.9,.16,1);
  z-index:0;
}
.about-btn .sans,
.about-btn .serif{ position:relative; z-index:1; }
.about-btn .sans{
  font-family:"Inter", system-ui, sans-serif;
  font-weight:800;
  font-size: clamp(12px, 1.4vw, 16px);
  letter-spacing:.05em;
}
.about-btn .serif{
  font-family:"Playfair Display", Georgia, serif;
  font-weight:700;
  font-size: clamp(14px, 1.6vw, 18px);
  letter-spacing:-.01em;
  margin-top:2px;
}
.about-btn:hover{ color:#fff; }
.about-btn:hover::after{ transform: translateY(0); }

/* ===== Mobil: ascundem coloana stângă, păstrăm totul frumos aliniat ===== */
@media (max-width: 768px){
  #about .about-left{ display:none !important; }
  #about .about-grid{ grid-template-columns: 1fr !important; }

  #about .about-right{
    align-items:flex-end !important;
    text-align:right !important;
  }
  #about .about-headline .row{ justify-content:flex-end !important; }

  /* descriere: mai aproape de headline + spațiu dreapta/stânga */
  .about-desc{
    max-width: 88%;
    margin-top: 20px;
  }
  .about-desc p{
    font-size: clamp(13px, 3.6vw, 16px);
    line-height: 1.5;
  }
}